<!DOCTYPE html>
<html>

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
	<title>大屏页面</title>
	<link rel="stylesheet" href="./Package/css/index.css">
	<link rel="stylesheet" href="./Package/element/element.css">
	<!-- <link href="http://api.map.baidu.com/library/TrafficControl/1.4/src/TrafficControl_min.css" rel="stylesheet"
    type="text/css" /> -->
	<style type="text/css">
		body,
		html,
		#allmap {
			width: 100%;
			height: 100%;
			overflow: hidden;
			margin: 0;
			font-family: "微软雅黑";
		}

		[v-cloak] {
			display: none;
		}
	</style>
</head>

<body>
	<div id="app" v-cloak>
		<!-- 地图 -->
		<div id="allmap"></div>

		<header>
			<span>{{title}}</span>
		</header>

		<!-- 右侧信息栏 -->
		<div class="dp-right " v-bind:class="{tableright: tableState}">
			<div class="event-list">
				<span>即时事件</span>
				<div class="ele_new_left_good event-content">
					<template v-for="item in EmergencyList">
						<div class="event-add" @click="Processingevent(item)" :class="tabClass(item)">
							<div class="event-add-title">
								<div v-if=item.unReadNum class="unReadInfo">{{item.unReadNum}}</div>
								<span :title="item.details"
									style="display: inline-block; width: 70%;  overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;">{{
									item.eTypeName
									}}
								</span>
								<span>{{item.eStatus == 0 ? '未处理' : (item.eStatus == 1 ? '处理中' : '已处理')}}</span>
							</div>
							<div class="event-add-content" :title="'在' + item.address + '发现' + item.details">在{{item.address + '发现' +
								item.details}}
							</div>
						</div>
					</template>
				</div>

				<a class="eventListAdd" href="./view/event.html" target="_blank">
					全部事件
				</a>
			</div>

			<div class="monitoring-list">
				<span>重点监控</span>
				<div class="monitoring-content">
					<template v-for="item in FocusMonitoring">
						<div>
							<iframe
								:src="'/ndzd/src/web3.0/cn/demo.html?ip='+ item.ip + '&username='+item.username+'&password='+ item.password +'&port='+item.port+'&channel='+item.channle"
								width="100%" height="100%" frameborder=0></iframe>
						</div>
					</template>
				</div>
			</div>

			<div class="Weather">
				<span>天气环境</span>
				<div class="Weather-content">
					<div class="Weather-content-img">
						<span>
							<h4>{{ weather.tem }}</h4>°C
						</span>
						<span><img src="../ndzd/Package/images/wd.png" width="11" height="20" alt=""> 温度</span>
					</div>
					<div class="Weather-content-img">
						<span>
							<h4>{{ weather.win_speed }}</h4>
						</span>
						<span><img src="../ndzd/Package/images/fs.png" width="19" height="17" alt=""> 风速</span>
					</div>
				</div>
			</div>
		</div>

		<!-- 左侧信息栏 -->
		<div class="dp-left" v-bind:class="{tableleft: tableState}">
			<!-- 应急指挥 -->
			<div class="select-list">
				<div class="select-list-left" @click="taget()">
					应急指挥
				</div>
				<div @click="eventstate = true" class="select-list-right">新增事件</div>
				<a href="/ndzd/dailyRecord.html" target="_blank" class="select-list-event">日常任务</a>
			</div>

			<!-- 资源检索 -->
			<!-- <div class="resources-list">
        <img src="./Package/images/ss.png" alt="">
        <input type="text" style="resize:none;" placeholder="资源检索" style="color: #fff;">
      </div> -->

			<!-- 值班 -->
			<div class="scheduling">
				<span>今日值班</span>
				<div class="scheduling-title">
					<div class="scheduling-img">
						<img src="../ndzd/Package/images/bl.png" alt="">
					</div>
					<p>当前用户: {{admin}}</p>
				</div>

				<div class="scheduling-bottom">
					<div class="scheduling-title-left">
						<p>班长: {{userAdmin.monitor}}</p>
					</div>

					<div class="scheduling-title-right">
						<p>值班员: {{userAdmin.onDutyPerson}}</p>
					</div>
				</div>
			</div>

			<!-- 信息 -->
			<div class="title-list">
				<img src="./Package/images/bjl.png" alt="">
				<img class="title-img" src="./Package/images/bjr.png" alt="">
				<pre>推送警情   <h1>{{ pushpolice }}</h1></pre>
			</div>

			<div class="title-list">
				<img src="./Package/images/dljkl.png" alt="">
				<img class="title-img" src="./Package/images/dljkr.png" alt="">
				<pre>道路监控   <h1>{{ roadmonitoringnum }}</h1></pre>
			</div>

			<div class="title-list">
				<img src="./Package/images/jrsjl.png" alt="">
				<img class="title-img" src="./Package/images/jrsjr.png" alt="">
				<pre>今日事件   <h1>{{EmergencyList.length}}</h1></pre>
			</div>

			<!-- 预警事件 -->
			<div class="early-warning">
				<span>预警信息</span>
				<div class="early-content ele_new_left_good">
					<template v-for="item in EarlywarningList">
						<div class="Weather-list">
							<h4>{{item.wTitle}}</h4>
							<p>{{item.wCreateTime ? item.wCreateTime : '2021-03-11 12:30:00'}}</p>
							<p :title="item.wDetail">{{item.wDetail}}</p>
						</div>
					</template>
				</div>
			</div>
		</div>

		<div class="tab-list" :class="{tablisttow:tableState}">
			<ul>
				<li @click="alarmEvent = !alarmEvent">
					<img src="./Package/images/jq-l.png" alt="">
					<span>警情</span>
				</li>

				<li @click="monitoringstate = !monitoringstate">
					<img src="./Package/images/jk-l.png" alt="">
					<span>监控</span>
				</li>

				<li @click="Policestate = !Policestate">
					<img src="./Package/images/jl-l.png" alt="">
					<span>警力</span>
				</li>

				<li @click="Vehiclestate = !Vehiclestate">
					<img src="./Package/images/cl-l.png" alt="">
					<span>车辆</span>
				</li>

				<li @click="Servicestate = !Servicestate">
					<img src="./Package/images/fwq.png" alt="" style="width: 30px;height: 30px;">
					<span>服务区</span>
				</li>

				<li @click="Bridgestate = !Bridgestate">
					<img src="./Package/images/ql-l.png" alt="">
					<span>桥梁</span>
				</li>

				<li @click="Tunnelstate = !Tunnelstate">
					<img src="./Package/images/sd-l.png" alt="">
					<span>隧道</span>
				</li>

				<li @click="Exchangestate = !Exchangestate">
					<img src="./Package/images/ht.png" alt="">
					<span>互通</span>
				</li>

				<li @click="Resourcesstate = !Resourcesstate">
					<img src="./Package/images/zy-l.png" alt="">
					<span>资源</span>
				</li>

				<!-- <li @click="Largescreenstate = !Largescreenstate">
          <img src="./Package/images/led-l.png" alt="">
          <span>LED屏</span>
        </li> -->
				<!-- <li @click="Pilestate = !Pilestate">
          <img src="./Package/images/bjz-l.png" alt="">
          <span>报警桩</span>
        </li> -->

			</ul>
		</div>

		<!-- 紧急事件弹窗 -->
		<div class="Emergency" v-if="EmergencyState">
			<span class="Emergency-title">{{userputadd()}}</span>
			<!-- <img @click="EmergencyState = false" class="Emergency-shutdown" src="../ndzd/Package/images/jjgb.png" alt="关闭"
        title="关闭"> -->
			<div class="Emergency-content">
				<li>
					<span>事件描述</span>:
					<p>
						&nbsp;&nbsp; {{Emergency.details}}
					</p>
				</li>
				<li>
					<span>发现地</span>:
					<p>
						&nbsp;&nbsp; {{Emergency.address ? Emergency.address : ''}}
					</p>
				</li>
				<li>
					<span>方向</span>:
					<p>
						&nbsp;&nbsp; {{Emergency.direction ? Emergency.direction : ''}}
					</p>
				</li>
			</div>
			<div class="Emergency-img">
				<el-image style="width: 100%; height: 100%" :src="httpimg + Emergency.spareList[0]"
					:preview-src-list="srcListtow(Emergency.spareList)">
					<div slot="error" class="image-slot">
						<img src="./Package/images/tb/person.png" style="width: 323px;height: 198px;">
					</div>
				</el-image>
			</div>

			<div class="Operation">
				<div class="Operation-cl" @click="ProcessingeventTow(Emergency)">处理</div>
				<div @click="EmergencyState = false" class="Operation-cl">忽略</div>
				<div @click="checkVideoSurveilLance(Emergency)" class="Operation-cl">视频</div>
			</div>
		</div>
		<!-- 内屏 -->
		<div class="returns" v-if="tableState" @click="returnState">
			返回
		</div>

		<!-- 处置情况 -->
		<div class="dp-situation" v-show="situationstates">
			<div class="situation-left" @click="eventEnd">
				<img src="../ndzd/Package/images/tc.png" width="17" height="17" alt=""> <span>事件结束</span>
			</div>
			<div class="situation-right">
				<span>已持续</span>
				<span>{{Fromnowon}}</span>
			</div>
		</div>

		<!-- 内屏左 -->
		<div class="dp-left dp-left-t gridclass" v-bind:class="{tableleft: tableStatetowleft}">
			<div class="Thestatusbar">
				<ul class="Thestatusbar-tab">
					<!-- <li>GIS搜索</li> -->
					<!-- <li @click="situation">当前情况</li> -->
					<li @click="Taskplan">任务管理</li>
					<li @click="EmergencyPlan">应急预案</li>
				</ul>

				<!-- <div class="Reported">

        </div> -->

				<div class="ReportedBottom">
					<ul class="Consultationtabs">
						<li @click="Basisclick(0)" :class="{CasePaneltabbg: Basisindex == 0 ? true:false}">
							基础
						</li>
						<!-- <li @click="Basisclick(1)" :class="{CasePaneltabbg: Basisindex == 1 ? true:false}">风险</li> -->
						<li @click="Basisclick(1)" :class="{CasePaneltabbg: Basisindex == 1 ? true:false}">协同</li>
						<!-- <li @click="Basisclick(3)" :class="{CasePaneltabbg: Basisindex == 3 ? true:false}">物资</li> -->
					</ul>

					<!-- 基础 -->
					<div class="ReportedBottomtabs" v-if="Basisindex==0">
						<div>
							<el-checkbox v-model="basisMonitoringState">监控</el-checkbox>
							<el-checkbox v-model="basisHospitalState">医院</el-checkbox>
							<el-checkbox v-model="basisPersonnelState">人员</el-checkbox>
							<el-checkbox>物资</el-checkbox>
							<el-checkbox v-model="basisCarState">车辆</el-checkbox>
							<el-checkbox>救援</el-checkbox>
						</div>
						<div class="ele_new_left_good" style="border-top: 1px solid #7ED8D0;overflow-y: auto;">
							<ul class="resourcesListclass ele_new_left_good">
								<template v-for="item in resourcesList">
									<li @click="Movemap(item)" v-if="item.img" :title="item.name">
										<span>
											<img :src="item.img" width="32px" height="32px" alt="">
											{{item.name}}
										</span>
										<i>{{item.api_distance_km}}KM</i>
									</li>
								</template>
							</ul>
						</div>
					</div>
					<!-- 协同 -->
					<div class="ReportedBottomtabs" v-if="Basisindex==1">
						<div>
							<el-checkbox v-model="collaborativePoliceState">人员</el-checkbox>
							<el-checkbox v-model="collaborativecarState">车辆</el-checkbox>
						</div>
						<div style="border-top: 1px solid #7ED8D0;">
							<ul class="resourcesListclass ele_new_left_good">
								<template v-for="item in resourcesList">
									<li @click="Movemap(item)" v-if="item.img">
										<span>
											<img :src="item.img" width="32px" height="32px" alt="">
											{{item.name}}
										</span>
										<i>{{item.api_distance_km}}KM</i>
									</li>
								</template>
							</ul>
						</div>
					</div>
				</div>
			</div>
		</div>

		<!-- 内屏右 -->
		<div class="dp-right" style="width: 325px;" v-bind:class="{tableright: tableStatetowright}">
			<div class="Operation-inside">
				<div class="Operation-inside-left" @click="disposalAdd">
					处置记录
				</div>
				<div class="Operation-inside-rigth" @click="SchedulingPhone">
					通信调度
				</div>
			</div>

			<!-- 天气 -->
			<div class="WeatherCondition">
				<div class="tqcon">
					<!-- <h4 class="tqcon-title">卧龙区</h4> -->
					<pre
						class="tqcon-content">{{ weather.tem }}°C {{ weather.wea }} {{ weather.win }} {{ weather.win_speed }}</pre>
					<pre class="tqcon-bottom">明天9°C-11°C 小雨 北风3-4级</pre>
				</div>
			</div>

			<div class="monitoring-list">
				<span>附近监控</span>
				<div class="monitoring-content">
					<template v-for="item in FocusMonitoringList">
						<div>
							<iframe
								:src="'/ndzd/src/web3.0/cn/demo.html?ip='+ item.ip + '&username='+item.username+'&password='+ item.password +'&port='+item.port+'&channel='+item.channle"
								width="100%" height="100%" frameborder=0></iframe>
						</div>
					</template>
				</div>
			</div>

			<div class="HitstraightScene">
				<span>直击现场</span>
				<div class="sceneclass">
					<template v-for="item in sxtToket">
						<!-- <iframe :src="'http://192.168.1.107:8082/demo/video.html?token=' + item +'&state=1'" width="100%"
              height="100%" frameborder="0"></iframe> -->
						<iframe :src="'/demo/video.html?token=' + item +'&state=1'" width="100%" height="100%"
							frameborder="0"></iframe>
					</template>
				</div>
			</div>
		</div>

		<!-- 预案面板 -->
		<div class="dp-left dp-left-t" v-bind:class="{CasePaneltab: tabCasePaneltab}">
			<!-- 内屏 -->
			<div class="CasePaneltab-returns" title="关闭" @click="DisposalShutdown">
				X
			</div>
			<!-- 应急预案 -->
			<div class="Eatingplne">
				<span>
					应急预案
				</span>
				<!-- 已启动预案 -->
				<div class="StartPlan ele_new_left_good" v-if="StartPlanList.length != 0">
					<template v-for="item in StartPlanList">
						<div class="eventconten">
							<h4><span class="Bubble">已启用</span> {{item.planName}}</h4>
							<span>{{item.introduceInfo}}</span>
							<ul>
								<li class="eventconten-title">
									<div class="eventtitle-top">
										<span>{{item.planLevel}}级</span>
										<div @click="eventEnter(item)">进入</div>
									</div>
									<div class="eventtitle-bottom">{{item.planContent}}</div>
								</li>
							</ul>
						</div>
					</template>
				</div>

				<!-- 标签 -->
				<div style="padding:0px 20px" v-if="tagetListadd.length != 0">
					<h4 style="color: #fff;">标签</h4>
					<el-checkbox-group v-model="taglistCities">
						<el-checkbox v-for="item in tagetListadd" :label="item.id" :key="item.id">{{item.tagName}}</el-checkbox>
					</el-checkbox-group>
				</div>

				<!-- 预案列表 -->
				<div class="eventPlan-bottom ele_new_left_good">
					<template v-for="item in eventPlanList">
						<div class="eventconten">
							<h4>{{item.planName}}</h4>
							<span>{{item.introduceInfo}}</span>
							<ul>
								<template v-for="itemtow in item.planDetailsList">
									<li class="eventconten-title">
										<div class="eventtitle-top">
											<span>{{itemtow.planLevel}}级</span>
											<div @click="eventStart(itemtow)">启用</div>
										</div>
										<div class="eventtitle-bottom">{{itemtow.planContent}}</div>
									</li>
								</template>
							</ul>
						</div>
					</template>
				</div>
			</div>
		</div>

		<!-- 任务管理 -->
		<div class="dp-left dp-left-t" style="width: 379px;" v-bind:class="{taskTab: TaskState}">
			<div class="taskManagement">
				<img src="../ndzd/Package/images/gb.png" alt="关闭" @click="tasktabstate">
				<h3>任务管理</h3>
				<div class="NewTasks" @click="Taskcontenton = true">
					新增任务
				</div>

				<ul class="NewTaskList ele_new_left_good">
					<!-- 已启动预案 -->
					<template v-for="item in TaskListadd">
						<div class="eventconten">
							<h4>自定义任务</h4>
							<span style="font-size:14px">{{item.taskContent}}</span>
							<p>被指派人：{{item.personNameList1.join(',')}} </p>
							<p>指派人：{{item.user}}</p>
							<p>指派时间：{{item.createTime}}</p>
							<div class="eventcontenTask">
								<h4 style="padding-left: 10px; margin-bottom: 10px;">执行记录({{item.taskInfoList.length}})</h4>
								<el-timeline>
									<template v-for="items in item.taskInfoList">
										<el-timeline-item placement="top" :timestamp="items.content" type="primary" size="large">
											<template v-for="itemss in items.imgList">
												<el-image style="width: 80px; height: 80px" :src="httpimg + itemss"
													:preview-src-list="srcList(item.taskInfoList)"></el-image>
											</template>
											<div class="taskInfoListclassbottom">
												<span>{{items.personName}}</span>
												<span>{{items.createTime}}</span>
											</div>
										</el-timeline-item>
									</template>
								</el-timeline>
							</div>
						</div>
					</template>
				</ul>
			</div>
		</div>

		<!-- 新增任务弹窗 -->
		<div class="eventEditTop" v-if="Taskcontenton">
			<div class="Taskcontent" v-show="Addtask">
				<img class="eventimg" src="../ndzd/Package/images/gb.png" style="top: 38px;" @click="Taskcontenton = false"
					alt="">
				<h3>新增任务</h3>
				<div class="Taskcontent-text ele_new_left_good">
					<h4>事件描述</h4>
					<ul>
						<li>
							<div class="MonitoringStyEvent-text">
								<span>事件标题</span>:
								<p style="width: calc(100% - 80px)">{{userputadd()}}</p>
							</div>
							<div class="MonitoringStyEvent-text">
								<span>发现地</span>:
								<p style="width: calc(100% - 80px)">{{Earlywarning.address}}</p>
							</div>
							<div class="MonitoringStyEvent-text">
								<span>道路方向</span>:
								<p style="width: calc(100% - 80px)">{{Earlywarning.direction}}</p>
							</div>
							<div class="MonitoringStyEvent-text">
								<span>详情</span>:
								<p style="width: calc(100% - 80px)" :title="Earlywarning.details">{{Earlywarning.details}}</p>
							</div>
					</ul>

					<h4>指派小组</h4>
					<div style="margin: 10px 0;">
						<el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全选
						</el-checkbox>
						<div style="margin: 15px 0;"></div>
						<el-checkbox-group v-model="checkedCities" @change="handleCheckedCitiesChange">
							<template v-for="item in cities">
								<el-checkbox v-for="items in item.personNodeList" :label="items.id" :key="items.id"
									:title="item.disposalContent">{{items.name}}
								</el-checkbox>
							</template>
						</el-checkbox-group>
					</div>

					<p>任务指派</p>
					<div class="assigned" @click="showassignperson">
						指派人员
					</div>
					<div class="assigned" @click="showassigncar">
						指派车辆
					</div>
					<el-input style="margin: 10px 0;" type="textarea" :rows="2" placeholder="请输入任务描述" v-model="describe">
					</el-input>
					<el-checkbox v-model="checked">同时短信通知</el-checkbox>
					<el-checkbox v-model="checkeds">同时语音通知</el-checkbox>
				</div>
				<div class="Taskcontent-Operation">
					<div @click="Taskcontenton = false">
						取消
					</div>
					<div class="Taskcontent-Operation-yers" @click="SendTask">
						确定
					</div>
				</div>
			</div>

			<div class="Taskcontent chooseUser" v-show="!Taskcontenttow">
				<img class="eventimg" src="../ndzd/Package/images/gb.png" style="top: 38px;" @click="showassign" alt="">
				<h3>选择用户</h3>
				<h3 style="margin-top: -45px;margin-left: 412px;">就近人员</h3>
				<div class="flexclass">

					<div class="Taskcontent-text  ele_new_left_good" style="width: 100%; height: 100%">
						<el-input placeholder="输入关键字进行过滤" v-model="filterText">
						</el-input>
						<el-tree class="filter-tree" show-checkbox :data="uerdataList" :props="defaultProps"
							:filter-node-method="filterNode" ref="tree">
						</el-tree>
					</div>

					<div class="userlistaddclass  ele_new_left_good">
						<div>
							<el-input v-model="inputNumber" placeholder="请输入内容" @input="inputNumberlist"></el-input>
							<el-radio-group v-model="radioNumber" @change="radioNumberadd">
								<el-radio label="2">2公里</el-radio>
								<el-radio label="3">3公里</el-radio>
								<el-radio label="5">5公里</el-radio>
								<el-radio label="10">10公里</el-radio>
								<el-radio label="100">100公里</el-radio>
							</el-radio-group>
						</div>
						<div class="ele_new_left_good" style="border-top: 1px solid #016E67; padding: 10px 0;overflow-y: auto;">
							<el-checkbox-group v-model="userlistaddstate">
								<el-checkbox v-for="item in userlistadd" :label="item.person.id" :key="item.person.id">
									{{item.person.name}}-{{item.distance}}KM</el-checkbox>
							</el-checkbox-group>
						</div>
					</div>
				</div>

				<div class="Taskcontent-Operation">
					<div @click="showassign">
						取消
					</div>
					<div @click='showassign'>
						确定
					</div>
				</div>
			</div>
			<div class="Taskcontent choosecar" v-show="!assigncar">
				<img class="eventimg" src="../ndzd/Package/images/gb.png" style="top: 38px;" @click="showassign" alt="">
				<h3>选择车辆</h3>
				<h3 style="margin-top: -45px;margin-left: 412px;">就近车辆</h3>
				<div class="flexclass">

					<div class="Taskcontent-text  ele_new_left_good" style="width: 100%; height: 100%">
						<el-checkbox-group v-model="caralllistaddstate">
							<el-checkbox v-for="item in caralllistadd" :label="item.vehiIdno" :key="item.vehiIdno">
								{{item.vehiIdno}}</el-checkbox>
						</el-checkbox-group>
					</div>

					<div class="userlistaddclass  ele_new_left_good">
						<div>
							<el-radio-group v-model="radioCarNumber" @change="radioCarNumberadd">
								<el-radio label="2">2公里</el-radio>
								<el-radio label="3">3公里</el-radio>
								<el-radio label="5">5公里</el-radio>
								<el-radio label="10">10公里</el-radio>
								<el-radio label="100">100公里</el-radio>
							</el-radio-group>
						</div>
						<div class="ele_new_left_good" style="border-top: 1px solid #016E67; padding: 10px 0;overflow-y: auto;">
							<el-checkbox-group v-model="carlistaddstate">
								<el-checkbox v-for="item in carlistadd" :label="item.vehiIdno" :key="item.vehiIdno">
									{{item.vehiIdno}}-{{item.distance}}KM</el-checkbox>
							</el-checkbox-group>
						</div>
					</div>
				</div>

				<div class="Taskcontent-Operation">
					<div @click="showassign">
						取消
					</div>
					<div @click='showassign'>
						确定
					</div>
				</div>
			</div>
		</div>

		<!-- 当前情况 -->
		<div class=" dp-left dp-left-t" v-bind:class="{CasePaneltab: situationstate}">
			<div class="situation">
				<!-- 内屏 -->
				<div class="CasePaneltab-returns" title="关闭" @click="situationtab">
					X
				</div>
			</div>
		</div>

		<!-- 电话调度 -->
		<div class="dp-right Consultation" v-bind:class="{tableright: SchedulingPhonestate}">
			<!-- 内屏 -->
			<div class="CasePaneltab-returns" style="top: -7px;" title="关闭" @click="Consultationtd">
				X
			</div>
			<ul class="Consultationtabs">
				<!-- <li @click="Consultationclick(0)" :class="{CasePaneltabbg: phonindex == 0 ? true:false}">
          <i class="el-icon-s-grid"></i>
        </li> -->
				<li @click="Consultationclick(1)" :class="{CasePaneltabbg: phonindex == 1 ? true:false}">通讯录</li>
				<!-- <li @click="Consultationclick(2)" :class="{CasePaneltabbg: phonindex == 2 ? true:false}">会商</li> -->
				<!-- <li @click="Consultationclick(3)" :class="{CasePaneltabbg: phonindex == 3 ? true:false}">智能组</li> -->
			</ul>

			<div class="Consultationplan borderclass" v-show="phonindex == 0">

			</div>
			<!-- 通讯录 -->
			<div class="Consultationplan" v-show="phonindex == 1">
				<el-input placeholder="输入关键字进行过滤" v-model="filterText">
				</el-input>
				<div class="Contacts ele_new_left_good">
					<el-tree class="filter-tree" show-checkbox :data="uerdataList" :props="defaultProps"
						:filter-node-method="filterNode" ref="tree">
					</el-tree>
				</div>
				<div class="Contacts-bottom">
					<div>
						加入会商
					</div>
				</div>
			</div>
			<div class="Consultationplan borderclass" v-show="phonindex == 2">
				<div class="iconclass">
					<img src="../ndzd/Package/images/退出.png" width="17" height="17" alt="">
					<span style="color: #fff;">admin</span>
					<div class="HallYes borderclass">
						大厅入会
					</div>
					<img src="../ndzd/Package/images/添加好友.png" width="17" height="17" alt="">
					<img src="../ndzd/Package/images/退出 (1).png" width="17" height="17" alt="">
				</div>
			</div>
			<div class="Consultationplan" v-show="phonindex == 3">
				<el-input placeholder="输入关键字进行过滤" v-model="filterText">
				</el-input>
				<div class="Contacts">
					<el-tree class="filter-tree" show-checkbox :data="uerdataList" :props="defaultProps"
						:filter-node-method="filterNode" ref="tree">
					</el-tree>
				</div>
				<div class="Contacts-bottom">
					<div>
						加入会商
					</div>
				</div>
			</div>
		</div>

		<!-- 处置记录 -->
		<div class="dp-right recordingclass ele_new_left_good" v-bind:class="{tableright: disposalstate}">
			<div class="CasePaneltab-returns" style="top: -5px;" title="关闭" @click="disposalstateadd">
				X
			</div>
			<el-timeline class="ele_new_left_good" style="height: 100%; overflow: auto;">
				<template v-for="item in Theplanningstep">
					<el-timeline-item :timestamp="item.handleCreateTime + '-' + item.handleTitle" placement="top" type="primary"
						size="large">
						<h4 style="color: #fff;">{{item.handleRemark}}</h4>
						<p style="padding: 5px 0; color: #fff;" v-if="item.personName">反馈人: {{item.personName}}</p>
						<!-- 录音文件 -->
						<template v-for="videos in item.voiceList">
							<div style="width: 90%; margin: 10px 0;">
								<audio :src="httpimg + videos" controls="controls" style="width: 100%;">
									您的浏览器不支持 audio 标签。
								</audio>
							</div>
						</template>
						<!-- 图片展示 -->
						<template v-for="itemss in item.imageList">
							<el-image style="width: 80px; height: 80px" :src="httpimg + itemss"
								:preview-src-list="srcListurl(Theplanningstep)"></el-image>
						</template>
					</el-timeline-item>
				</template>
			</el-timeline>
		</div>

		<!-- 事件编辑 -->
		<div class="eventEditTop" v-show="eventstate">
			<div class="eventEdit">
				<img class="eventimg" src="../ndzd/Package/images/gb.png" @click="eventstate = false" alt="">
				<h3 v-if="eventstatemap">新增事件</h3>
				<h3 v-if="!eventstatemap ">事件详情查看</h3>
				<el-form v-if="eventstatemap" ref="form" label-position="top" :model="form" :inline="true"
					class="ele_new_left_good"
					style="height: 86%;overflow: auto; display: flex; justify-content: space-between; flex-wrap: wrap; align-content: flex-start">
					<el-form-item label="事件类型:" style="width: 48%;">
						<el-select style="width: 100%; z-index: 99;" v-model="form.eType" placeholder="请输入事件类型">
							<el-option v-for="item in EventList" :key="item.id" :label="item.eventName" :value="item.id.toString()">
							</el-option>
						</el-select>
					</el-form-item>

					<el-form-item label="位置描述:" style="width: 48%;">
						<div style="display: flex; color: #fff;">
							<p style="width: 246px;">S98内邓高速</p>
							<el-input size="small" v-model="kill" placeholder="请输入公里数"></el-input>
							<span>KM+</span>
							<el-input size="small" v-model="killMeter" placeholder="请输入米"></el-input>
							<span>M</span>
						</div>
					</el-form-item>

					<el-form-item style="width: 100%;">
						<span style="color: #00a2ff; margin-right: 20px;">道路方向:</span>
						<el-radio v-model="form.direction" label="上行">上行</el-radio>
						<el-radio v-model="form.direction" label="下行">下行</el-radio>
					</el-form-item>

					<el-form-item label="事件详情:" style="width: 100%;">
						<el-input type="textarea" :rows="3" placeholder="请输入事件详情" v-model="form.details">
						</el-input>
					</el-form-item>

					<el-form-item label="上传图片:" style="width: 100%;">
						<el-upload :action="uploadImgUrl" :headers="token" list-type="picture-card"
							:before-upload="beforeAvatarUpload" :on-success="uploadImg" :on-remove="deleteImg">
							<i class="el-icon-plus"></i>
						</el-upload>
					</el-form-item>
				</el-form>

				<el-form v-if="!eventstatemap" ref="form" :model="form" class="ele_new_left_good"
					style="height: 86%;overflow: auto;">
					<el-form-item>
						<div class="eventdetail">
							<span style="color: #1a75cf; margin-right: 20px;">事件类型:</span>
							<p>{{userputaddtow(form.eType)}}</p>
						</div>
					</el-form-item>

					<el-form-item>
						<div class="eventdetail">
							<span style="color: #1a75cf; margin-right: 20px;">发生时间:</span>
							<p>{{form.eCreateTime}}</p>
						</div>
					</el-form-item>

					<el-form-item>
						<div class="eventdetail">
							<span style="color: #1a75cf; margin-right: 20px;">发生地:</span>
							<p>{{form.address}}</p>
						</div>
					</el-form-item>

					<el-form-item>
						<div class="eventdetail">
							<span style="color: #1a75cf; margin-right: 20px;">道路方向:</span>
							<p>{{form.direction}}</p>
						</div>
					</el-form-item>
					<el-form-item>
						<div class="eventdetail">
							<span style="color: #1a75cf; margin-right: 20px;">事件描述:</span>
							<p>{{form.details}}</p>
						</div>
					</el-form-item>
					<el-form-item label="图片:">
						<template v-for="item in form.spareList">
							<el-image style="width: 148px; height: 148px;margin: 10px 10px;" :src="httpimg + item"
								:preview-src-list="srcListtow(form.spareList)"></el-image>
						</template>
					</el-form-item>
				</el-form>

				<div v-if="eventstatemap" class="Taskcontent-Operation"
					style="position: absolute; bottom: 20px; left: 0; right: 0; color: #fff;">
					<div @click="eventstate = false">
						取消
					</div>
					<div class="Taskcontent-Operation-yers" @click="submintadd">
						提交
					</div>
				</div>
			</div>
		</div>

		<!-- 地图切换按钮 -->
		<ul class="maptype" v-if="mapstateadd">
			<li class="maptype-Ordinary" v-bind:class="{maptypeborder : maptype.bk}" @click="Ordinary">
				<div>
					<span :class="{maptypebg : maptype.bg}">地图</span>
				</div>
			</li>
			<li class="maptype-Satellite" v-bind:class="{maptypeborder : !maptype.bk}" @click="Satellite">
				<div class="mapnetwork">
					<el-checkbox v-model="maptype.checked" @change="network">开启路网</el-checkbox>
				</div>
				<div>
					<span :class="{maptypebg : !maptype.bg}">卫星</span>
				</div>
			</li>
		</ul>

		<div class="Positioningclass" title="返回原点" @click="returnOrigin" v-if="mapstateadd">
			<img src="../ndzd/Package/images/dw.png" alt="">
		</div>

		<!-- 弹出层 -->
		<div class="theTaskComplete" v-if="isDisabled">
			<div class="ttc-center">
				<span>
					任务结束
				</span>
				<ul>
					<li>
						<span>事件类型:</span>
						<p>{{eventEndList.eventTypeName}}</p>
					</li>
					<li>
						<span>结束人员:</span>
						<p>{{eventEndList.personName}}</p>
					</li>
				</ul>
				<div class="but">
					<el-button size="mini" type="danger" round @click="CanceleventEnd()">驳回</el-button>
					<el-button size="mini" type="primary" round @click="addeventEnd()">同意({{second}})</el-button>
				</div>
			</div>
		</div>
		<!-- 110工单 -->
		<div class="eventEditTop" v-show="workorder">
			<div class="eventEdit">
				<img class="eventimg" src="../ndzd/Package/images/gb.png" @click="workorder = false" alt="">
				<h3 v-if="eventstatemap">新增事件</h3>
				<h3 v-if="!eventstatemap ">事件详情查看</h3>
				<el-form v-if="eventstatemap" ref="form" label-position="top" :model="form" :inline="true"
					class="ele_new_left_good"
					style="height: 86%;overflow: auto; display: flex; justify-content: space-between; flex-wrap: wrap; align-content: flex-start">
					<el-form-item label="事件类型:" style="width: 48%;">
						<el-select style="width: 100%; z-index: 99;" v-model="form.eType" placeholder="请输入事件类型">
							<el-option v-for="item in EventList" :key="item.id" :label="item.eventName" :value="item.id.toString()">
							</el-option>
						</el-select>
					</el-form-item>

					<el-form-item label="位置描述:" style="width: 48%;">
						<div style="display: flex; color: #fff;">
							<p style="width: 246px;">S98内邓高速</p>
							<el-input size="small" v-model="kill" placeholder="请输入公里数"></el-input>
							<span>KM+</span>
							<el-input size="small" v-model="killMeter" placeholder="请输入米"></el-input>
							<span>M</span>
						</div>
					</el-form-item>

					<el-form-item style="width: 100%;">
						<span style="color: #00BDB0; margin-right: 20px;">道路方向:</span>
						<el-radio v-model="form.direction" label="上行">上行</el-radio>
						<el-radio v-model="form.direction" label="下行">下行</el-radio>
					</el-form-item>

					<el-form-item label="事件详情:" style="width: 100%;">
						<el-input type="textarea" :rows="3" placeholder="请输入事件详情" v-model="form.details">
						</el-input>
					</el-form-item>

					<el-form-item label="上传图片:" style="width: 100%;">
						<el-upload :action="uploadImgUrl" :headers="token" list-type="picture-card"
							:before-upload="beforeAvatarUpload" :on-success="uploadImg" :on-remove="deleteImg">
							<i class="el-icon-plus"></i>
						</el-upload>
					</el-form-item>
				</el-form>

				<el-form v-if="!eventstatemap" ref="form" :model="form" class="ele_new_left_good"
					style="height: 86%;overflow: auto;">
					<el-form-item>
						<div class="eventdetail">
							<span style="color: #1a75cf; margin-right: 20px;">事件类型:</span>
							<p>{{userputaddtow(form.eType)}}</p>
						</div>
					</el-form-item>

					<el-form-item>
						<div class="eventdetail">
							<span style="color: #1a75cf; margin-right: 20px;">发生时间:</span>
							<p>{{form.eCreateTime}}</p>
						</div>
					</el-form-item>

					<el-form-item>
						<div class="eventdetail">
							<span style="color: #1a75cf; margin-right: 20px;">发生地:</span>
							<p>{{form.address}}</p>
						</div>
					</el-form-item>
					<el-form-item>
						<div class="eventdetail">
							<span style="color: #1a75cf; margin-right: 20px;">道路方向:</span>
							<p>{{form.direction}}</p>
						</div>
					</el-form-item>
					<el-form-item>
						<div class="eventdetail">
							<span style="color: #1a75cf; margin-right: 20px;">事件描述:</span>
							<p>{{form.details}}</p>
						</div>
					</el-form-item>
					<el-form-item label="图片:">
						<template v-for="item in form.spareList">
							<el-image style="width: 148px; height: 148px;margin: 10px 10px;" :src="httpimg + item"
								:preview-src-list="srcListtow(form.spareList)"></el-image>
						</template>
					</el-form-item>
				</el-form>

				<div v-if="eventstatemap" class="Taskcontent-Operation"
					style="position: absolute; bottom: 20px; left: 0; right: 0; color: #fff;">
					<div @click="workorder = false">
						取消
					</div>
					<div class="Taskcontent-Operation-yers" @click="submintadd">
						提交
					</div>
				</div>
			</div>
		</div>
	</div>
</body>

</html>

<script src="./Package/js/vue.js"></script>
<!-- <script src="./Package/js/vueRouter.js"></script> -->

<script src="./Package/element/element.js"></script>
<script src="./Package/js/jquery-1.7.2.js"></script>

<!--弹窗-->
<script src="./Package/layer/layer.js"></script>

<!-- 百度地图3.0 离线API Begin -->

<!-- <script src="http://11.154.64.237:51008/bmap-offline/map3.0_init.js"></script>
<script src="http://11.154.64.237:51008/bmap-offline/map3.0.js"></script> -->
<!-- <script type="text/javascript" src="http://192.168.200.3:9500/map/map3.0_init.js"></script>
<script type="text/javascript" src="http://192.168.200.3:9500/map/map3.0.js"></script> -->

<!-- 百度地图 -->
<script type="text/javascript" src="//api.map.baidu.com/api?v=2.0&ak=IHkpqWPrVexItnG1WweaPh9utTIiRMsH"></script>

<!-- ip -->
<script src="./Package/js/config.js"></script>

<!-- 点聚合 -->
<script src="./Package/js/MarkerClusterer_min.js"></script>
<script src="./Package/js/TextIconOverlay_min.js"></script>

<!-- 百度地图自定义窗口函数 -->
<script src="./Package/js/InfoBox_min.js"></script>
<script src="./Package/js/index.js"></script>

<!-- 监控 -->
<script src="./Package/js/Monitoring.js"></script>
<!-- 服务区 -->
<script src="./Package/js/service_area.js"></script>
<!-- 互通 -->
<script src="./Package/js/interchange.js"></script>
<!-- 隧道 -->
<script src="./Package/js/tunnel.js"></script>
<!-- 桥梁 -->
<script src="./Package/js/bridge.js"></script>

<!-- 事件推送 -->
<script src="./Package/js/socketPush.js"></script>
<script src="./Package/js/collaborativePolice.js"></script>

<!-- 交通流量控件 -->
<script src="./Package/js/jt.js"></script>

<!-- 警情 -->
<script src="./Package/js/alarm.js"></script>

<script src="./Package/js/base64.js"></script>
<script>
	var vm = new Vue({
		el: "#app",
		data: {
			// 登陆者
			userAdmin: {},
			uploadImgUrl: imgurlUplode,
			checkAll: true,
			checkedCities: [],
			cities: [],
			isIndeterminate: false,

			title: '应急指挥信息平台',
			httpurl: httpurl,
			httpimg: httpimg,
			map: '', // 地图实例
			maptow: '',
			maptowstate: true, // 当前没有点击点
			maskLayer: {
				// 东西经南北纬的范围必须有
				EN_JW: '180, 90;', // 东北角
				NW_JW: '-180,  90;', // 西北角
				WS_JW: '-180, -90;', // 西南角
				SE_JW: '180, -90;', // 东南角 

				lng: 111.803648,
				level: "city",
				hierarchy: "10",
				coordinates: [
					"113.7474,32.66126;113.79175,32.64437;113.78635,32.62713;113.81445,32.60087;113.78972,32.58635;113.782,32.56618;113.76432,32.55347;113.77427,32.53736;113.7595,32.51204;113.76181,32.47066;113.74129,32.46537;113.73821,32.45341;113.73048,32.46062;113.72533,32.43603;113.71025,32.42196;113.71858,32.4172;113.70828,32.41029;113.70154,32.42041;113.66327,32.42174;113.66681,32.41262;113.65122,32.41343;113.63659,32.38591;113.6246,32.37949;113.62348,32.36036;113.59373,32.36527;113.60562,32.35055;113.57878,32.35548;113.58302,32.34307;113.56182,32.34067;113.55129,32.32927;113.55937,32.30547;113.5482,32.30626;113.55008,32.32876;113.52989,32.33083;113.42544,32.2694;113.39793,32.27927;113.37667,32.29837;113.3508,32.29617;113.33206,32.31611;113.31837,32.31902;113.33134,32.34196;113.29873,32.35396;113.29336,32.37036;113.23633,32.40695;113.22836,32.42435;113.21179,32.43199;113.15913,32.41067;113.15025,32.37626;113.11871,32.37581;113.10796,32.39848;113.07892,32.39442;113.04694,32.42002;113.02753,32.42546;112.99511,32.41088;112.98806,32.37233;112.96987,32.37114;112.95414,32.38851;112.91186,32.39075;112.87912,32.37472;112.87858,32.39258;112.87046,32.39785;112.77635,32.35838;112.76276,32.34275;112.73493,32.35168;112.73358,32.36621;112.71917,32.36177;112.71364,32.35258;112.70109,32.35316;112.67616,32.36679;112.64549,32.36845;112.612,32.38706;112.57518,32.39017;112.54526,32.40387;112.53078,32.37699;112.51964,32.38335;112.49303,32.37444;112.47722,32.38081;112.44664,32.35744;112.45041,32.34286;112.39902,32.36977;112.36117,32.36613;112.35117,32.35045;112.33229,32.3417;112.32533,32.32158;112.25659,32.35879;112.22747,32.38619;112.2059,32.39298;112.17276,32.38517;112.17904,32.39286;112.17168,32.39904;112.174,32.4085;112.14363,32.40702;112.16165,32.40014;112.14949,32.38703;112.16447,32.38531;112.15687,32.3771;112.13025,32.40311;112.10845,32.40476;112.08084,32.42249;112.08604,32.4353;112.06741,32.44062;112.06402,32.47424;112.03812,32.4701;112.00705,32.45103;112.00109,32.45942;111.99043,32.45748;111.99285,32.46734;111.97475,32.47264;111.95051,32.51643;111.88121,32.5063;111.86196,32.53181;111.80312,32.54305;111.74738,32.5776;111.72122,32.60435;111.67013,32.62023;111.6464,32.60619;111.64082,32.63476;111.61837,32.62762;111.57765,32.59349;111.55911,32.6011;111.53025,32.62833;111.52658,32.65418;111.51107,32.67627;111.46787,32.70737;111.47264,32.71778;111.4411,32.7228;111.42547,32.73265;111.44331,32.72661;111.44354,32.73698;111.46037,32.72709;111.47566,32.75841;111.46762,32.7716;111.46193,32.7744;111.46265,32.76379;111.44823,32.76148;111.44367,32.75121;111.42294,32.75099;111.41355,32.75715;111.38003,32.82882;111.29354,32.85939;111.29072,32.89257;111.28013,32.90434;111.24998,32.8842;111.24324,32.93705;111.27365,32.97185;111.2588,33.00648;111.24053,33.01998;111.2382,33.04081;111.18329,33.04766;111.14827,33.0424;111.15802,33.05811;111.19289,33.07162;111.19094,33.08673;111.17703,33.10119;111.17952,33.11547;111.1409,33.13444;111.13154,33.14244;111.1316,33.16074;111.11168,33.16177;111.09405,33.18053;111.07324,33.18065;111.04006,33.15692;111.05783,33.18359;111.05654,33.19274;110.98501,33.25543;110.99703,33.25475;110.98288,33.27008;110.99708,33.2873;110.99849,33.30142;111.00795,33.3037;111.00035,33.32396;111.02605,33.3304;111.02997,33.33941;111.02344,33.34914;111.02615,33.37532;110.99672,33.43596;111.02088,33.45085;111.02734,33.46954;111.02544,33.50492;111.01949,33.52083;111.00356,33.53309;111.00367,33.54808;111.00996,33.56053;111.02515,33.55058;111.05093,33.55347;111.07008,33.56635;111.08769,33.5634;111.11309,33.57686;111.13395,33.61237;111.13466,33.62745;111.15162,33.64299;111.13313,33.67893;111.18131,33.68687;111.19622,33.71596;111.19605,33.75774;111.21032,33.78407;111.23251,33.80167;111.26084,33.79676;111.27366,33.77999;111.3042,33.775;111.31835,33.76309;111.39004,33.77125;111.48452,33.72648;111.52398,33.74287;111.54141,33.7334;111.63219,33.72609;111.68499,33.67748;111.72861,33.68807;111.81942,33.65292;111.82968,33.60075;111.88454,33.59611;111.92106,33.57053;112.02038,33.58773;112.0281,33.59458;112.01335,33.59674;112.01496,33.61364;112.0322,33.62459;112.05904,33.60525;112.0875,33.60306;112.09195,33.61309;112.073,33.6401;112.07401,33.65316;112.12058,33.66884;112.14176,33.69164;112.15033,33.71367;112.16863,33.72178;112.18502,33.69871;112.22325,33.71629;112.25065,33.71962;112.25957,33.7116;112.28089,33.71207;112.30655,33.69977;112.33,33.6697;112.35326,33.66994;112.36111,33.66126;112.41931,33.67725;112.45837,33.64153;112.49323,33.63899;112.53231,33.58728;112.54809,33.59388;112.55689,33.58817;112.59469,33.61908;112.6098,33.61294;112.61771,33.59725;112.63446,33.59481;112.6602,33.60538;112.68917,33.58716;112.72415,33.58731;112.77091,33.56058;112.81179,33.58031;112.84566,33.57809;112.85479,33.60364;112.8687,33.6114;112.8879,33.60831;112.89352,33.61612;112.91758,33.60565;112.94219,33.60813;112.95012,33.59094;112.97293,33.58462;112.99077,33.5678;113.02287,33.56117;113.02621,33.54748;113.03592,33.54797;113.04732,33.53218;113.04444,33.51271;113.05369,33.48691;113.03933,33.46537;113.04571,33.43946;113.07484,33.44844;113.10698,33.44691;113.12475,33.44043;113.13579,33.4256;113.18493,33.43451;113.23053,33.38964;113.23053,33.37496;113.24066,33.37436;113.24497,33.36534;113.25798,33.36615;113.27707,33.35027;113.29599,33.35137;113.30955,33.34138;113.33962,33.35164;113.40702,33.32842;113.40067,33.31311;113.40537,33.30373;113.38458,33.29443;113.40014,33.26105;113.40288,33.23524;113.39124,33.22595;113.37942,33.18637;113.36901,33.18536;113.38653,33.16721;113.37934,33.13868;113.38879,33.12841;113.384,33.1093;113.31542,33.07572;113.25894,33.08372;113.2193,33.06459;113.19249,33.06869;113.1228,33.00487;113.09784,32.94726;113.11554,32.933;113.14012,32.93064;113.14713,32.94112;113.16193,32.92744;113.20816,32.91642;113.20069,32.89052;113.20557,32.88492;113.16606,32.84114;113.18702,32.82062;113.17829,32.80579;113.18525,32.7883;113.17586,32.77767;113.2014,32.74531;113.19152,32.71771;113.20486,32.71948;113.21377,32.70306;113.23667,32.69879;113.23627,32.68259;113.2599,32.6778;113.26933,32.66207;113.25914,32.65351;113.25268,32.66689;113.22261,32.68486;113.18786,32.65225;113.19224,32.6354;113.20266,32.63331;113.19566,32.60323;113.2044,32.57049;113.24084,32.57637;113.25188,32.59529;113.28051,32.596;113.30831,32.57899;113.32045,32.5885;113.3421,32.56779;113.35157,32.57365;113.36547,32.56944;113.40374,32.61346;113.44249,32.58628;113.458,32.58625;113.45943,32.57509;113.50924,32.5698;113.52525,32.59414;113.54227,32.58917;113.56541,32.60269;113.57157,32.62476;113.58548,32.63587;113.58891,32.6504;113.59869,32.65238;113.59316,32.66052;113.61898,32.6666;113.61739,32.69115;113.60958,32.698;113.61742,32.71342;113.62736,32.70467;113.6511,32.70772;113.66839,32.69241;113.69626,32.69561;113.7474,32.66126"
				],
				name: "南阳市",
				lat: 32.76717,
			}, // 遮罩层信息
			mask: '',

			alarmEvent: false, // 警情
			monitoringstate: false, // 监控状态
			Policestate: false, // 警力
			Vehiclestate: false, // 车辆
			Servicestate: false, // 服务区状态
			Exchangestate: false, // 互通
			Bridgestate: false, //桥梁
			Tunnelstate: false, // 隧道
			Resourcesstate: false, // 资源

			EmergencyList: [], // 紧急事件
			Emergency: {}, // 最新事件信息
			EmergencyState: false, // 紧急事件弹窗

			FocusMonitoring: [], // 重点监控列表
			FocusMonitoringList: [], //附近重点监控
			EarlywarningList: [], // 天气预警信息

			// 样式切换
			tableState: false, // 外屏 false
			tableStatetowleft: true, // 内屏左 truw
			tableStatetowright: true, // 内屏右 false
			disposalstate: true, // 处置记录

			situationstates: false, // 处置时间面板
			tabCasePaneltab: true, // 预案面板
			TaskState: true, // 任务管理
			situationstate: true, // 当前情况
			SchedulingPhonestate: true, // 电话调度 true

			phonindex: 1, // 初始值
			Basisindex: 0, // 初始值

			EventList: [], // 事件类型列表
			PlanList: [], // 预案信息

			// 资源信息
			resourcesList: [],

			Earlywarning: '', // 当前展示的事件信息
			Fromnowon: '', // 距今多少时间

			eventstate: false, // 事件详情编辑页面
			eventstatemap: true, // 地图是否加载

			eventPlanList: [], // 预警信息

			StartPlanList: [], // 启动预案
			Theplanningstep: [], // 预案步骤列表

			Taskcontenton: false, // 任务面板
			Taskcontenttow: true, // 新增任务
			checked: true, // 短信通知
			checkeds: true, // 语音通知

			TaskListadd: [], // 任务列表
			describe: '', // 任务信息
			assigncar: true,

			mapstateadd: true, // 定位到

			clearTime: '', //时间

			form: {
				lng: '',
				lat: '',
			}, //事件信息

			filterText: '',
			uerdataList: [], // 人员信息
			defaultProps: {
				children: 'children',
				label: 'name'
			},

			user: '',

			userlistadd: [], // 人员
			userlistaddstate: [], //选中的人
			carlistadd: [], // 车辆
			carlistaddstate: [], //选中的车辆
			caralllistadd: [], // 全部车辆
			caralllistaddstate: [], //全部选中的车辆

			// 地图状态切换状态
			maptype: {
				bk: true, // 卫星
				bg: true, // 混合卫星
				checked: false, // 普通
			},

			basisMonitoringState: true, // 基础监控状态
			basisHospitalState: true, // 基础医院状态
			basisPersonnelState: true, // 基础人员状态
			basisCarState: true,  //基础车辆状态

			collaborativePoliceState: true, // 协同警员
			collaborativecarState: true,   //协同车辆
			Radius: 5, // 圆的半径

			polymerizationemphasiscamera: null, // 重点监控方法
			polymerizationemphasiscameraList: [], // 重点监控信息

			polymerizationMedical: null, // 医院聚合方法
			polymerizationMedicalList: [], // 医院聚合数据

			polymerizationUser: null, // 人员聚合方法
			polymerizationUserList: [], // 人员聚合

			polymerizationCar: null, // 车辆聚合方法
			polymerizationCarList: [], // 车辆聚合

			polymerizationrelevant: null,   //相关人员
			polymerizationrelevantList: [],   //相关人员

			taglistCities: [], // 选中的人
			tagetListadd: [], // 标签

			isDisabled: false, // 弹出层
			second: 20,
			intervaleventEnd: null, //弹出层定时任务

			eventEndList: '', // 结束任务

			kill: '', // 公里数
			killMeter: '',

			inputNumber: '', // 输入框
			radioNumber: '', // 选择的值
			radioCarNumber: '', // 附近车选择的公里数

			sxtToket: [], // 摄像头toket
			token: {
				Authorization: ''
			},
			imageUrl: [], // 存图片数据
			workorder: false, //110工单是否显示
			roadmonitoringnum: '',  //道路监控
			pushpolice: '',    //推送警情
			admin: '',  //当前账户

			Addtask: true,
			weather: {
				tem: '30',
				win_speed: '二级'
			},
			getTaskList: '',   //处置记录定时任务
		},
		// 侦听器
		watch: {
			// 警情
			alarmEvent(val) {
				if (val) {
					this.eventListadd();
				} else {
					this.clear('alarmListmap');
				}
			},
			// 监控
			monitoringstate(val) {
				if (val) {
					this.getlist('road_camera');
				} else {
					this.clear('monitoring');
					if (vm.polymerizationemphasiscamera != null) {
						vm.polymerizationemphasiscamera.removeMarkers(vm.polymerizationemphasiscameraList);
					}
				}
			},
			// 服务区
			Servicestate(val) {
				if (val) {
					this.getlist('service_area');
				} else {
					this.clear('servicearea');
				}
			},
			// 警力
			Policestate(val) {
				if (val) {
					Policestateadd()
				} else {
					this.clear('policestate');
				}
			},
			//车辆
			Vehiclestate(val) {
				if (val) {
					Vehiclestateadd()
				} else {
					this.clear('vehiclestate');
					if (this.polymerizationCar != null) {
						this.polymerizationCar.removeMarkers(this.polymerizationCarList); // 清除车辆聚合数据
					}
				}
			},
			// 桥梁
			Bridgestate(val) {
				if (val) {
					this.getlist('bridge');
				} else {
					this.clear('bridge');
				}
			},
			Tunnelstate(val) {
				if (val) {
					this.getlist('tunnel');
				} else {
					this.clear('tunnel');
				}
			},
			// 互通
			Exchangestate(val) {
				if (val) {
					this.getlist('interchange');
				} else {
					this.clear('interchange');
				}
			},
			// 资源
			Resourcesstate(val) {
				if (val) {
					this.getlist('social_resources');
				} else {
					this.clear('Medical');
					if (vm.polymerizationMedical != null) {
						vm.polymerizationMedical.removeMarkers(vm.polymerizationMedicalList); // 清除医院聚合数据
					}
				}
			},
			eventstate(val) {
				if (val) {

				} else {
					this.eventstatemap = true;
					this.form = {
						"address": "",
						"details": "",
						"direction": "",
						"eTypeName": "",
						"source": ""
					}
				}
			},
			filterText(val) {
				this.$refs.tree.filter(val);
			},
			EmergencyState(val) {
				if (!val) {
					// 删除语音播报
					window.speechSynthesis.cancel();
				}
			},
			// 事件信息切换
			Basisindex(val) {
				vm.clear('circle'); // 清除圆
				vm.clear('Collaborative-personnel'); // 协同人员
				vm.clear('Collaborative-car');
				vm.clear('personnel');
				vm.clear('policestate');
				vm.clear('Medical');
				vm.clear('monitoring');
				vm.clear('vehiclestate');
				vm.clear('carnel');
				// 摄像头
				if (vm.polymerizationemphasiscamera != null) {
					vm.polymerizationemphasiscamera.removeMarkers(vm.polymerizationemphasiscameraList)
				}
				// 清除医院聚合数据
				if (vm.polymerizationMedical != null) {
					vm.polymerizationMedical.removeMarkers(vm.polymerizationMedicalList);
				}
				// 清除人员点聚合信息
				if (vm.polymerizationUser != null) {
					vm.polymerizationUser.removeMarkers(vm.polymerizationUserList);
				}
				if (vm.polymerizationCar != null) {
					vm.polymerizationCar.removeMarkers(vm.polymerizationCarList); // 清除车辆聚合数据
				}
				// 触发事件
				if (val == 0 && !this.tableStatetowleft) {
					socketPush(this.Earlywarning)
				} else if (val == 1) {
					collaborativePoliceAdd(this.Earlywarning);
				}

			},
			// 基础信息监控
			basisMonitoringState(val) {
				if (val) {
					Resources(this.Earlywarning, 'road_camera', Math.ceil(vm.Radius) || 50); // 道路监控
				} else {
					this.clear('monitoring'); // 清除监控

					// 摄像头
					if (vm.polymerizationemphasiscamera != null) {
						vm.polymerizationemphasiscamera.removeMarkers(vm.polymerizationemphasiscameraList)
					}

					this.clearlistadd('monitoring') // 清除列表信息
				}
			},
			// 基础信息医院
			basisHospitalState(val) {
				if (val) {
					Resources(this.Earlywarning, 'social_resources', Math.ceil(this.Radius));
				} else {
					this.clear('Medical'); // 清除医院
					if (vm.polymerizationMedical != null) {
						vm.polymerizationMedical.removeMarkers(vm.polymerizationMedicalList); // 清除医院聚合数据
					}
					this.clearlistadd('Medical') // 清除列表信息
				}
			},
			// 基础信息最近的人员
			basisPersonnelState(val) {
				if (val) {
					userResources(this.Earlywarning, Math.ceil(this.Radius));
				} else {
					this.clear('personnel'); // 清除人员

					if (vm.polymerizationUser != null) {
						vm.polymerizationUser.removeMarkers(vm.polymerizationUserList); // 清除人员点聚合信息
					}

					this.clearlistadd('personnel') // 清除列表信息
				}
			},
			basisCarState(val) {
				if (val) {
					carResources(this.Earlywarning, Math.ceil(this.Radius));
				} else {

					if (vm.polymerizationCar != null) {
						vm.polymerizationCar.removeMarkers(vm.polymerizationCarList);
					}
					this.clear('carnel')
					this.clearlistadd('carnel') // 清除列表信息
				}
			},
			// 协同警员
			collaborativePoliceState(val) {
				if (val) {
					xtry(this.Earlywarning)
				} else {
					this.clear('Collaborative-personnel'); // 清除人员					
					this.clearlistadd('Collaborative-personnel') // 清除列表信息
				}
			},
			collaborativecarState(val) {
				if (val) {
					collaborativecardata(this.Earlywarning)
				} else {
					this.clear('Collaborative-car'); // 清除人员					
					this.clearlistadd('Collaborative-car') // 清除列表信息
				}
			},
			// 标签状态改变
			taglistCities(val) {
				if (!this.tabCasePaneltab) {
					this.getEarlywarningList(); // 获取预警信息
				}
			}
		},
		methods: {
			// 今日值班
			userList() {
				$.ajax({
					type: 'get',
					url: httpurl + 'event/eventProvisionalPerson/list',

					dataType: 'json',
					contentType: "application/json",
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						if (data.code == 200) {
							console.log(data);
							vm.userAdmin = data.rows[0];
						} else {
							vm.$message({
								message: '数据获取失败请联系管理员',
								type: 'warning'
							});
						}
					},
					error: function (err) {
						vm.$message({
							message: '数据获取失败请联系管理员',
							type: 'warning'
						});
					}
				})
			},
			// 全选全不选
			handleCheckAllChange(state) {
				let add = [];
				for (let [key, val] of Object.entries(this.cities)) {
					for (let [keys, vals] of Object.entries(val.personNodeList)) {
						add.push(vals.id)
					}
				}

				this.checkedCities = state ? add : [];
				this.isIndeterminate = false;
			},
			// 选完人后的回调函数
			handleCheckedCitiesChange(value) {
				let add = [];
				for (let [key, val] of Object.entries(this.cities)) {
					for (let [keys, vals] of Object.entries(val.personNodeList)) {
						add.push(vals.id)
					}
				}

				let checkedCount = value.length;
				this.checkAll = checkedCount === add.length;
				this.isIndeterminate = checkedCount > 0 && checkedCount < add.length;
			},

			// 清除信息
			clearlistadd(name) {
				for (let i = 0; i < this.resourcesList.length; i++) {
					if (this.resourcesList[i].init == name) {
						this.resourcesList.splice(i, 1);
						i--
					}
				}
			},
			// 实例化百度地图
			newmap() {
				this.map = new BMap.Map("allmap", {
					enableMapClick: false
				}); // 创建Map实例
				this.map.centerAndZoom(new BMap.Point(this.maskLayer.lng, this.maskLayer.lat), 11); // 初始化地图,用城市名设置地图中心点
				this.map.enableScrollWheelZoom() // 开启地图缩放功能
				this.map.addTileLayer() // 开启地图路况功能
				this.map.setMapType(BMAP_NORMAL_MAP)
				this.map.disableContinuousZoom();

				// var ctrl = new BMapLib.TrafficControl({
				//   showPanel: true //是否显示路况提示面板
				// });
				// this.map.addControl(ctrl);
				// ctrl.showTraffic();//显示路况
			},
			maptowmap() {
				this.maptow = new BMap.Map("maptow"); // 创建Map实例
				this.maptow.centerAndZoom(new BMap.Point(this.maskLayer.lng, this.maskLayer.lat), 8); // 初始化地图,用城市名设置地图中心点
				this.maptow.enableScrollWheelZoom() // 开启地图缩放功能
				this.maptow.addTileLayer() // 开启地图路况功能
				this.maptow.setMapType(BMAP_HYBRID_MAP)
				this.maptow.disableContinuousZoom()

				this.maptow.addEventListener('click', function (e) {
					vm.form.longitude = e.point.lng + ''
					vm.form.latitude = e.point.lat + ''
					var point = new BMap.Point(e.point.lng, e.point.lat)
					// 点位
					var marker = new BMap.Marker(point, {
						enableDragging: true
					});

					vm.cleartow('maptowmar')
					marker.init = 'maptowmar'
					vm.maptow.addOverlay(marker)
				});
			},
			returnOrigin() {
				// 切换图层
				vm.map.setZoom(11);
				// 地图移动
				vm.map.panTo(new BMap.Point(this.maskLayer.lng, this.maskLayer.lat), false);
			},
			// 点击地图移动到点位上去
			Movemap(data) {
				// 地图移动
				vm.map.setZoom(14);
				if (data.ip) {      //点击左侧摄像头
					var point = new BMap.Point(data.lng, data.lat)
					// 创建小车图标
					var myIcon = new BMap.Icon("./Package/images/tb/jk-c.png", new BMap.Size(30, 30));
					// 点位
					var marker = new BMap.Marker(point, { icon: myIcon });
					// 覆盖物标识
					marker.init = 'monitoring'
					var content = `
					  <div class="MonitoringSty monbackingss">
					    <div class="MonitoringSty-title">监控预览</div>
					    <span>  地点: ${data.name}</span>
					    <div class="MonitoringSty-video">
					      <iframe id="child" src="./src/web3.0/cn/demo.html?ip=${data.ip}&username=${data.username}&password=${data.password}&port=${data.port}&channel=${data.channle}" width="100%" height="100%" frameborder=0></iframe>
					    </div >
					
					    <div class="controlVideo">
					      <p onclick="deliver('top')" class="yxtop"></p>
					      <p onclick="deliver('bottom')" class="yxbottom"></p>
					      <p onclick="deliver('left')" class="yxleft"></p>
					      <p onclick="deliver('right')" class="yxright"></p>
					
					      <p onclick="deliver('tl')" class="yxtl"></p>
					      <p onclick="deliver('tr')" class="yxtr"></p>
					      <p onclick="deliver('bl')" class="yxbl"></p>
					      <p onclick="deliver('br')" class="yxbr"></p>
					    </div>
					
					    <div class="CameraVariation">
					      <div onclick="deliver('big')" class="CameraVariation_big">
					        <img src="./Package/images/big.png" />
					      </div>
					      <div onclick="deliver('small')" class="CameraVariation_small">
					        <img src="./Package/images/small.png" />
					      </div>
					    </div>
					
					  </div >
					  `
					openInfo(content, marker, 'monitoring');
				} else {
					vm.map.panTo(new BMap.Point(data.lng, data.lat), false);
				}
			},
			Ordinary() {
				this.maptype.bk = true
				this.maptype.bg = true
				this.maptype.checked = false
				this.map.setMapType(BMAP_NORMAL_MAP);

				// 样式持久化存储
				this.Persistence_SetItem()
			},
			// 卫星图
			Satellite() {
				this.maptype.bk = false
				this.maptype.bg = false
				this.map.setMapType(BMAP_SATELLITE_MAP);
				if (this.maptype.checked) {
					vm.map.setMapType(BMAP_HYBRID_MAP);
				}

				// 样式持久化存储
				this.Persistence_SetItem()
			},
			// 开启路网
			network() {
				if (this.maptype.checked) {
					this.map.setMapType(BMAP_HYBRID_MAP); // 混合地图
				} else {
					this.map.setMapType(BMAP_SATELLITE_MAP);
				}

				// 样式持久化存储
				this.Persistence_SetItem()
			},
			// 样式持久化存储
			Persistence_SetItem() {
				// 把当前状态保存到本地
				window.localStorage.setItem('maptype', JSON.stringify(this.maptype));
			},
			// 清除覆盖物函数
			clear(init) {
				var allOverlay = this.map.getOverlays();
				for (var i = 0; i < allOverlay.length; i++) {
					if (allOverlay[i].init == init) {
						this.map.removeOverlay(allOverlay[i]);
					}
				}
			},
			cleartow(init) {
				var allOverlay = this.maptow.getOverlays();
				for (var i = 0; i < allOverlay.length; i++) {
					if (allOverlay[i].init == init) {
						this.maptow.removeOverlay(allOverlay[i]);
					}
				}
			},
			newmaskLayer() {
				// // 外围围栏
				// this.mask = new BMap.Polygon(this.maskLayer.coordinates[0] + this.maskLayer.SE_JW + this.maskLayer.SE_JW + this.maskLayer.WS_JW + this.maskLayer.NW_JW + this.maskLayer.EN_JW + this.maskLayer.SE_JW, {
				//   strokeColor: 'none',
				//   fillColor: '#333',
				//   fillOpacity: 0.7,
				// })

				// //建立多边形覆盖物
				// this.mask.disableMassClear() // 不予许被清除
				// this.map.addOverlay(this.mask)

				// //5. 给目标行政区划添加边框，其实就是给目标行政区划添加一个没有填充物的遮罩层
				// var ply = new BMap.Polygon(this.maskLayer.coordinates[0], { strokeWeight: 2, strokeColor: '#00bdb0', fillColor: '' })
				// ply.disableMassClear() // 不予许被清除
				// this.map.addOverlay(ply)
				// // this.map.setViewport(ply.getPath());    //调整视野

				// var polyline = new BMap.Polyline([
				//   new BMap.Point(116.399, 39.910),
				//   new BMap.Point(116.405, 39.920),
				//   new BMap.Point(116.423493, 39.907445),
				//   new BMap.Point(116.608939, 39.217422)
				// ], { strokeColor: "blue", strokeWeight: 2, strokeOpacity: 0.5 });   //创建折线
				// this.map.addOverlay(polyline);   //增加折线

				$.ajax({
					type: 'post',
					url: httpurl + 'event/manager/locationAll/getLanAndLonBySpeed',
					data: JSON.stringify({
						// "roadName": "内邓高速"
					}),
					dataType: 'json',
					contentType: "application/json",
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						// console.log(data)
						if (data.data.localData.length != 0) {
							for (let [key, val] of Object.entries(data.data.localData)) {
								let arrlist = []
								for (let [keys, vals] of Object.entries(val)) {
									arrlist.push(new BMap.Point(vals.lng, vals.lat))
								}
								var polyline = new BMap.Polyline(arrlist, {
									strokeWeight: 8,
									strokeColor: "#3385FF",
									strokeOpacity: .8
								}); //创建折线
								vm.map.addOverlay(polyline); //增加折线
							}
						}
					},
					error: function (err) {
						// 失败的回调
					}
				})
			},

			// 登陆系统获取token
			init() {
				this.token.Authorization = localStorage.getItem('token');
				// 事件列表
				this.evenList();
				// 重点监控列表 
				this.getFocusMonitoring();
				// 天气预警信息
				this.getEarlywarning();
				// 事件类型列表
				this.getEventList();
				// 获取人员信息
				this.getuserList();
				// 获取登陆者
				this.userList();
				this.newmaskLayer();

				// 获取标签
				this.gettagList();

				//道路监控
				this.roadmonitoring();

				// 获取用户信息
				$.ajax({
					type: 'get',
					url: httpurl + 'system/user/getInfo',
					data: {},
					dataType: 'json',
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						// 成功的回调
						if (!data.user.admin) {
							wbs(data.user.userId);
							wbsInfo(data.user.userId)
						}
						vm.admin = data.user.userName;
					},
					error: function (err) {
						// 失败的回调
					}
				})

				// 获取直击现场摄像头toke
				$.ajax({
					type: 'get',
					url: httpurl + 'event/ys7Api/getToken',
					data: {},
					dataType: 'json',
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						// console.log(data)
						vm.sxtToket.push(data.data.accessToken)
					},
					error: function (err) {
						// 失败的回调
					}
				})

				// 改变状态
				this.alarmEvent = true // 警情
				// vm.monitoringstate = true // 监控状态
				// vm.Policestate = true // 警力
				// vm.Servicestate = true // 服务区状态
				// vm.Exchangestate = true // 互通
				// vm.Bridgestate = true //桥梁
				// vm.Tunnelstate = true // 隧道
				// vm.Resourcesstate = true // 资源

			},
			// 获取摄像头列表
			getlist(name) {
				// road_camera 监控
				$.ajax({
					type: 'post',
					url: httpurl + 'basicInfo/manager/category/getFacilitiesData/' + name,
					data: {
						pageSize: 99999
					},
					dataType: 'json',
					contentType: "application/json",
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						if (data.code == 200) {
							if (name == 'road_camera') {
								monitoringList(data.rows, 'road_camera')
							} else if (name == 'service_area') {
								serviceArea(data)
							} else if (name == 'interchange') {
								interchange(data)
							} else if (name == 'bridge') {
								bridge(data)
							} else if (name == 'tunnel') {
								tunnel(data)
							} else if (name == 'social_resources') {
								SocialList(data.rows)
							}

						} else {
							vm.$message({
								message: '数据获取失败请联系管理员',
								type: 'warning'
							});
						}
					},
					error: function (err) {
						// 失败的回调
						console.log(err)
					}
				})
			},

			// 获取事件列表
			evenList() {
				$.ajax({
					type: 'get',
					url: httpurl + 'event/manager/event/list',
					data: {},
					dataType: 'json',
					contentType: "application/json",
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						if (data.code == 200) {
							console.log(data);
							const infoIconList = data.rows;
							// vm.EmergencyList = data.rows;
							$.ajax({
								type: 'get',
								url: httpurl + 'event/manager/event/unRead/handle',
								data: {},
								dataType: 'json',
								contentType: "application/json",
								headers: {
									Authorization: localStorage.getItem('token')
								},
								success: function (res) {
									console.log(res);
									let infoIcon = res.data
									for (var i = 0; i < infoIconList.length; i++) {
										for (var j = 0; j < infoIcon.length; j++) {
											if (infoIconList[i].eId == infoIcon[j].eId) {
												infoIconList[i].unReadNum = infoIcon[j].count
											}
										}
									}
									vm.EmergencyList = infoIconList
								}
							})

						}
					},
					error: function (err) {
						// 失败的回调
						vm.$message({
							message: err.msg,
							type: 'error'
						});
					}
				})
			},
			// 获取当前警情事件
			eventListadd() {
				$.ajax({
					type: 'get',
					url: httpurl + 'event/manager/event/list',
					data: {},
					dataType: 'json',
					contentType: "application/json",
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						// console.log(data)
						if (data.code == 200) {
							alarmListMap(data.rows)
						}
					},
					error: function (err) {
						// 失败的回调
					}
				})
			},
			// 获取重点监控列表
			getFocusMonitoring() {
				$.ajax({
					type: 'POST',
					url: httpurl + 'basicInfo/manager/category/getFacilitiesData/emphasis_camera',
					data: {
						pageSize: 99999
					},
					dataType: 'json',
					contentType: "application/json",
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						if (data.code == 200) {
							vm.FocusMonitoring = data.rows
						}
					},
					error: function (err) {
						// 失败的回调
						console.log(err)
					}
				})
			},
			// 样式切换
			tabClass(item) {
				if (item.eStatus == 0) {
					return 'redclass';
				} else if (item.eStatus == 1) {
					return 'yelloclass';
				} else {
					return 'greadclass'
				}

			},
			// 弹出层即时事件
			ProcessingeventTow(item) {

				// 面板切换
				this.tableState = true;
				this.mapstateadd = false;
				// 切换过渡效果
				setTimeout(() => {
					this.situationstates = true;
					this.tableStatetowleft = false;
					this.tableStatetowright = false
				}, 1500)

				// 存储事件预案id
				this.Earlywarning = item;
				// 关闭弹窗
				this.EmergencyState = false;

				if (item.spare1) {
					this.getDisposalConceptBySceneId(item); // 派送任务信息列表
				}

				// 更改时间
				this.clearTime = setInterval(() => {
					this.Fromnowon = Timeconversion(item.eCreateTime)
				}, 3000)

				// 修改当前的事件状态
				// $.ajax({
				//   type: 'put',
				//   url: httpurl + 'event/manager/event',
				//   data: JSON.stringify({
				//     eId: item.eId,
				//     eStatus: 1,
				//   }),
				//   dataType: 'json',
				//   contentType: "application/json",
				//   headers: {
				//     Authorization: localStorage.getItem('token')
				//   },
				//   success: function (data) {
				//     // 成功的回调
				//     console.log(data)
				//   },
				//   error: function (err) {
				//     // 失败的回调
				//   }
				// })

				// 公共状态信息修改
				this.evenrPushState(item);
				this.getTaskList = setInterval(() => {
					if (localStorage.getItem('token')) {
						this.getTaskListy(); // 获取任务处置记录列表
					}
				}, 3000);
			},
			// 点击事件推送列表
			Processingevent(item) {
				if (item.eStatus == 2) {
					return this.$message({
						message: '事件已处理,请选择其他事件',
						type: 'warning'
					});
				}

				// 更改时间
				this.clearTime = setInterval(() => {
					this.Fromnowon = Timeconversion(item.eCreateTime)
				}, 3000)

				// 面板切换
				this.tableState = true;
				this.mapstateadd = false;

				// 切换过渡效果
				setTimeout(() => {
					this.situationstates = true;
					this.tableStatetowleft = false;
					this.tableStatetowright = false

					// 关闭事件持续状态
					if (item.eStatus > 1) {
						this.situationstates = false;
					}
				}, 1500)

				this.Earlywarning = item; // 存储事件预案id

				if (item.spare1) {
					this.getDisposalConceptBySceneId(item); // 派送任务信息列表
				}

				// 公共状态信息修改
				this.evenrPushState(item);
				this.getTaskList = setInterval(() => {
					if (localStorage.getItem('token')) {
						this.getTaskListy(); // 获取任务处置记录列表
					}
				}, 3000);
			},
			evenrPushState(item) {

				// 修改状态
				if (item.eStatus < 1) {
					$.ajax({
						type: 'put',
						url: httpurl + 'event/manager/event',
						data: JSON.stringify({
							eId: item.eId,
							eStatus: ++item.eStatus,
						}),
						dataType: 'json',
						contentType: "application/json",
						headers: {
							Authorization: localStorage.getItem('token')
						},
						success: function (data) {
							// 成功的回调
							// console.log(data)
						},
						error: function (err) {
							// 失败的回调
						}
					})
				}

				this.getEarlywarningList(); // 获取预警信息
				this.getevent(); // 查询启动的预案
				socketPush(item); // 事件推送到地图
				this.neighborhoodMonitor(item);
				this.evenList(); // 事件列表
				this.getTaskListy(); //获取任务处置记录列表

				// 改变状态
				this.alarmEvent = false // 警情事件
				this.monitoringstate = false // 监控状态
				this.Policestate = false // 警力
				this.Vehiclestate = false  //车辆
				this.Servicestate = false // 服务区状态
				this.Exchangestate = false // 互通
				this.Bridgestate = false //桥梁
				this.Tunnelstate = false // 隧道
				this.Resourcesstate = false // 资源
			},
			disposalstateadd(val) {
				this.disposalstate = true;
				setTimeout(() => {
					this.tableStatetowright = false;
				}, 1500)

			},
			// 返回上一级页面
			returnState() {
				this.tableStatetowleft = true;
				this.tableStatetowright = true;
				this.tabCasePaneltab = true;
				this.TaskState = true // 任务管理
				this.situationstate = true // 当前情况
				this.situationstates = false // 处置时间面板
				this.SchedulingPhonestate = true // 会商
				this.mapstateadd = true;
				this.disposalstate = true;

				this.form = {}; // 清空form
				this.eventstatemap = true; // 编辑页面
				this.resourcesList = []; // 清空数据

				this.Basisindex = 0;

				setTimeout(() => {
					this.tableState = false;
				}, 1500)

				this.clear('circle'); // 清除圆圈
				this.clear('socketevent'); // 清除事件图标
				this.clear('monitoring'); // 摄像头
				this.clear('Medical'); // 基础信息医院
				this.clear('personnel'); // 基础信息人员
				this.clear('Collaborative-personnel'); // 协同人员
				this.clear('Collaborative-car');
				this.clear('polylineEvent'); // 线
				this.clear('labelevent'); // 公里数
				this.clear('carnel');   //车辆

				// 摄像头
				if (this.polymerizationemphasiscamera != null) {
					this.polymerizationemphasiscamera.removeMarkers(this.polymerizationemphasiscameraList)
				}
				if (this.polymerizationMedical != null) {
					this.polymerizationMedical.removeMarkers(this.polymerizationMedicalList); // 清除医院聚合数据
				}
				if (this.polymerizationUser != null) {
					this.polymerizationUser.removeMarkers(this.polymerizationUserList); // 清除人员点聚合信息
				}
				if (this.polymerizationCar != null) {
					this.polymerizationCar.removeMarkers(this.polymerizationCarList); // 清除车辆聚合数据
				}
				this.Radius = 5 // 圆半径
				this.evenList(); // 事件请求

				// 返回原点
				this.returnOrigin();

				// 清除定时器
				clearInterval(this.clearTime);
				clearInterval(this.getTaskList)
				// 改变状态
				vm.alarmEvent = true // 警情
				// this.monitoringstate = true // 监控状态
				// this.Policestate = true // 警力
				// this.Servicestate = true // 服务区状态
				// this.Exchangestate = true // 互通
				// this.Bridgestate = true //桥梁
				// this.Tunnelstate = true // 隧道
				// this.Resourcesstate = true // 资源
			},
			// 结束预案
			eventEnd() {
				$.ajax({
					type: 'put',
					url: httpurl + 'event/manager/event',
					data: JSON.stringify({
						eId: this.Earlywarning.eId,
						eStatus: 2,
					}),
					dataType: 'json',
					contentType: "application/json",
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {

						// 返回上一级页面
						vm.returnState();
					},
					error: function (err) {
						// 失败的回调
					}
				})
			},
			// 天气预警信息
			getEarlywarning() {
				$.ajax({
					type: 'GET',
					url: httpurl + 'basicInfo/manager/warning/list',
					data: {
						pageSize: 99999
					},
					dataType: 'json',
					contentType: "application/json",
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						if (data.code == 200) {
							vm.EarlywarningList = data.rows
						}
					},
					error: function (err) {
						// 失败的回调
					}
				})
			},
			// 获取事件类型列表
			getEventList() {
				$.ajax({
					type: 'GET',
					url: httpurl + 'event/manager/exigencyEvent/list',
					data: {
						pageSize: 99999
					},
					dataType: 'json',
					contentType: "application/json",
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						if (data.code == 200) {
							vm.EventList = data.rows
						}
					},
					error: function (err) {
						// 失败的回调
					}
				})
			},
			// 获取应急列表
			getPlan(name) {
				$.ajax({
					type: 'POST',
					url: httpurl + 'event/manager/plan/matchingPlan',
					data: JSON.stringify({
						keyword: name
					}),
					dataType: 'json',
					contentType: "application/json",
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						if (data.code == 200) {
							vm.PlanList = data.data
						}
					},
					error: function (err) {
						// 失败的回调
					}
				})
			},
			// 跳转的系统内
			taget() {
				// location.href = 'http://192.168.1.107:80/index';
				location.href = '/index';
			},
			// 点击紧急预案
			EmergencyPlan() {
				this.tableStatetowleft = true;
				setTimeout(() => {
					this.tabCasePaneltab = false; // 预案面板
					this.defaultlabel();
				}, 1500)
			},
			//默认选中的标签
			defaultlabel() {
				$.ajax({
					type: 'GET',
					url: httpurl + 'event/eventTag/' + this.Earlywarning.eType,
					dataType: 'json',
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						// console.log(data)
						vm.taglistCities = data.data;
					}
				})
			},
			DisposalShutdown() {
				this.tabCasePaneltab = true; // 预案面板
				setTimeout(() => {
					this.tableStatetowleft = false;
				}, 1500)
			},
			// 任务管理
			Taskplan() {
				this.tableStatetowleft = true;
				setTimeout(() => {
					this.TaskState = false;
				}, 1500)
			},
			tasktabstate() {
				this.TaskState = true;
				setTimeout(() => {
					this.tableStatetowleft = false;
				}, 1500)
			},
			// 当前情况
			situation() {
				this.tableStatetowleft = true;
				setTimeout(() => {
					this.situationstate = false;
				}, 1500)
			},
			situationtab() {
				this.situationstate = true;
				setTimeout(() => {
					this.tableStatetowleft = false;
				}, 1500)
			},
			disposalAdd() {
				this.tableStatetowright = true;
				setTimeout(() => {
					this.disposalstate = false;
				}, 1500)
			},
			// 通信调度
			SchedulingPhone() {
				this.tableStatetowright = true;

				setTimeout(() => {
					this.SchedulingPhonestate = false;
				}, 1500)
			},
			Consultationtd() {
				this.SchedulingPhonestate = true;

				setTimeout(() => {
					this.tableStatetowright = false;
				}, 1500)
			},
			Consultationclick(index) {
				this.phonindex = index;
			},
			Basisclick(index) {
				this.Basisindex = index;
			},
			// 提交数据
			submintadd() {
				$.ajax({
					type: 'post',
					url: httpurl + 'event/manager/locationAll/getLngAndLatByKm',
					data: JSON.stringify({
						speedName: '内邓高速',
						kill: vm.kill
					}),
					dataType: 'json',
					contentType: "application/json",
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						// console.log(data)
						if (data.data) {
							vm.form.longitude = data.data.longNumber
							vm.form.latitude = data.data.latNumber
							vm.form.address = `内邓高速K${vm.kill}KM${vm.killMeter != '' ? '+' + vm.killMeter + 'M ' : ''}`.trim();
							vm.form.spare = vm.imageUrl.join(',')
							vm.form.source = '手工录入'
							$.ajax({
								type: 'post',
								url: httpurl + 'event/manager/event',
								data: JSON.stringify(vm.form),
								dataType: 'json',
								contentType: "application/json",
								headers: {
									Authorization: localStorage.getItem('token')
								},
								success: function (data) {
									// console.log(data)
									// 成功的回调
									vm.eventstate = false
									vm.form = {};
									vm.kill = '';
									vm.killMeter = '';
								},
								error: function (err) {
									// 失败的回调
								}
							})
						} else {
							vm.$message({
								message: '不在辖区内',
								type: 'warning'
							});

						}
					},
					error: function (err) {
						// 失败的回调
					}
				})
			},

			// 获取预警信息
			getEarlywarningList() {
				$.ajax({
					type: 'post',
					url: httpurl + 'event/manager/plan/getPlan',
					data: JSON.stringify({
						planTagList: this.taglistCities
					}),
					dataType: 'json',
					contentType: "application/json",
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						vm.eventPlanList = data.data
					},
					error: function (err) {
						// 失败的回调
					}
				})
			},
			// 启动预案
			eventStart(data) {
				$.ajax({
					type: 'post',
					url: httpurl + 'event/accident/initAccidentOrder',
					data: JSON.stringify({
						eventId: Number(this.Earlywarning.eType),
						bigEventId: this.Earlywarning.eId,
						plandetailsId: Number(data.id)
					}),
					dataType: 'json',
					contentType: "application/json",
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						// 查询启动的预案
						vm.getevent();
					},
					error: function (err) {
						// 失败的回调
					}
				})
			},
			// 查询启动的预案
			getevent() {
				$.ajax({
					type: 'get',
					url: httpurl + 'event/manager/order/getAccident/' + this.Earlywarning.eId,
					data: {},
					dataType: 'json',
					contentType: "application/json",
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						// 成功的回调
						vm.StartPlanList = data.data
					},
					error: function (err) {
						// 失败的回调
					}
				})
			},
			eventEnter(item) {
				//      window.open(`http://192.168.1.107:9910/ndzd/plan.html?id=${item.id}`);
				window.open(`/ndzd/plan.html?id=${item.id}`);
			},

			// 获取人员信息
			getuserList() {
				$.ajax({
					type: 'get',
					url: httpurl + 'person/personInfo/getPersonTree',
					data: {},
					dataType: 'json',
					contentType: "application/json",
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						// 成功的回调
						vm.uerdataList = data.data
					},
					error: function (err) {
						vm.$message({
							message: err.msg,
							type: 'error'
						});
					}
				})
			},
			filterNode(value, data) {
				if (!value) return true;
				return data.label.indexOf(value) !== -1;
			},
			// 选中的节点
			Selecteduser(data) {
				// 关闭选择人员信息
				this.Taskcontenttow = !this.Taskcontenttow;
			},
			// 查询任务
			getTaskListy() {
				$.ajax({
					type: 'get',
					url: httpurl + 'event/manager/task/tasklist',
					data: {
						eventId: this.Earlywarning.eId,
						taskType: 0
					},
					dataType: 'json',
					contentType: "application/json",
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						// 成功的回调
						vm.TaskListadd = data.data
					},
					error: function (err) {
						vm.$message({
							message: err.msg,
							type: 'error'
						});
					}
				})

				// 处理记录
				$.ajax({
					xhrFields: {
						withCredentials: true,
					},
					type: 'get',
					url: httpurl + 'event/manager/handle/list',
					data: {
						handleEventId: this.Earlywarning.eId
					},
					dataType: 'json',
					contentType: "application/json",
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						vm.Theplanningstep = data.rows
					},
					error: function (err) {
						// 失败的回调
					}
				})
			},
			// 添加任务
			SendTask() {
				// cities 信息
				// checkedCities 选中的人
				if (this.checkedCities.length != 0) {
					for (let val of this.cities) {
						for (let vals of val.personNodeList) {
							if (this.checkedCities.indexOf(vals.id) != -1) {
								// 以组的形势发送
								let names = [];
								let ids = [];
								for (valstow of vals.children) {
									names.push(valstow.name);
									ids.push(valstow.id);
									// if (vals.children.length == name.length) {
									//   this.pushSubmitadd(ids, names, val.disposalContent);
									// }
								}
								this.pushSubmitadd(ids, names, val.disposalContent);
							}
						}
					}
				}

				// 单人指派
				let data = this.$refs.tree.getCheckedNodes();
				let listid = [];
				let listname = [];
				for (var i = 0; i < data.length; i++) {
					if (!data[i].children) {
						listid.push(data[i].id)
						listname.push(data[i].name)
					}
				}
				for (let [key, val] of Object.entries(this.userlistadd)) {
					if (this.userlistaddstate.indexOf(val.person.id) != -1) {
						listid.push(val.person.id)
						listname.push(val.person.name)
					}
				}
				if (listname.length != 0) {
					this.pushSubmitadd(listid, listname, this.describe)
				}

				this.describe = '';
			},
			pushSubmitadd(listid, listname, text) {
				$.ajax({
					type: 'post',
					url: httpurl + 'event/manager/task',
					data: JSON.stringify({
						taskContent: text, // 任务简报
						eventId: this.Earlywarning.eId, // 事件id
						taskType: 0,
						personList: JSON.stringify(listid),
						personNameList: JSON.stringify(listname),
						isMessage: this.checked ? 1 : 0, //发送短信
						isVoice: this.checkeds ? 1 : 0, //发送语音
						carList: JSON.stringify(this.caralllistaddstate.concat(this.carlistaddstate))
					}),
					dataType: 'json',
					contentType: "application/json",
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						// console.log(data)
						// 成功的回调
						// vm.Taskcontenton = false;
						// 任务记录
						// vm.$message({
						//   message: '任务指派成功',
						//   type: 'success'
						// });
						if (data.code == 200) {
							vm.Taskcontenton = false;
						} else {
							vm.$message({
								message: '任务指派失败',
								type: 'error'
							});
						}
						vm.getTaskListy(); // 获取任务处置记录列表
					},
					error: function (err) {
						// 失败的回调
					}
				})
			},
			// 获取图片地址
			srcList(data) {
				let url = [];
				for (let [key, val] of Object.entries(data)) {
					if (val.imgList) {
						for (let [keys, vals] of Object.entries(val.imgList)) {
							url.push(httpimg + vals)
						}
					}
				}
				return url;
			},
			srcListtow(data) {
				let url = [];
				for (let [key, val] of Object.entries(data)) {
					url.push(httpimg + val)
				}
				return url;
			},
			srcListurl(data) {
				let url = [];
				for (let [key, val] of Object.entries(data)) {
					if (val.imageList) {
						for (let [keys, vals] of Object.entries(val.imageList)) {
							url.push(httpimg + vals)
						}
					}
				}
				return url;
			},
			srcListadd(item) {
				let url = [];
				for (let val of item) {
					url.push(
						this.httpimg + val
					)
				}
				return url;
			},
			userputadd() {
				// 事件标题
				let name = ''
				for (let [key, val] of Object.entries(this.EventList)) {
					if (val.id == this.Earlywarning.eType) {
						name = val.eventName
						break;
					}
				}
				return name;
			},
			userputaddtow(id) {
				for (let [key, val] of Object.entries(this.EventList)) {
					if (val.id == id) {
						return val.eventName;
						break;
					}
				}
			},
			// 获取任务描述列表
			getDisposalConceptBySceneId(data) {
				$.ajax({
					type: 'get',
					url: httpurl + 'event/eventScene/getDisposalConcept/' + data.eId,
					data: {},
					dataType: 'json',
					contentType: "application/json",
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						if (data.code == 200) {
							// 成功的回调
							vm.cities = data.data
							vm.checkedCities = [];

							for (let [key, val] of Object.entries(data.data)) {
								for (let [keys, vals] of Object.entries(val.personNodeList)) {
									vm.checkedCities.push(vals.id);
								}
							}
						}
					},
					error: function (err) {
						vm.$message({
							message: err.msg,
							type: 'error'
						});
					}
				})
			},
			// 获取标签管理
			gettagList() {
				$.ajax({
					type: 'get',
					url: httpurl + 'event/manager/tag/findAll',
					data: {},
					dataType: 'json',
					contentType: "application/json",
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						// 成功的回调
						// console.log(data);
						if (data.data.length != 0) {
							vm.tagetListadd = data.data;
							// for(let [key, val] of Object.entries(data.data)) {
							// 	vm.taglistCities.push(val.id)
							// }
						}
					},
					error: function (err) {
						vm.$message({
							message: err.msg,
							type: 'error'
						});
					}
				})
			},
			// 取消任务
			CanceleventEnd() {
				this.addagree(0);
			},
			// 确定任务
			addeventEnd() {
				this.addagree(1)
			},
			// 是否同意
			addagree(state) {
				window.clearInterval(this.intervaleventEnd);
				this.second = 20;
				this.isDisabled = false;
				// 0 不同意 1同意
				$.ajax({
					type: 'POST',
					url: httpurl + 'event/manager/task/updateStatus/' + this.eventEndList.taskId,
					data: JSON.stringify({
						"status": state
					}),
					dataType: 'json',
					contentType: "application/json",
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						// 成功的回调
						// console.log(data)
					},
					error: function (err) {
						// 失败的回调
					}
				})
			},
			// 输入的值
			inputNumberlist() {
				if (vm.inputNumber != '') {
					userlistadddata(this.form, vm.inputNumber);
					this.userlistaddstate = [];
					vm.radioNumber = vm.inputNumber
				}
			},
			// 公里数改变
			radioNumberadd() {
				userlistadddata(this.form, vm.radioNumber);
				this.userlistaddstate = [];
				vm.inputNumber = ''
			},
			// 附近车公里数改变
			radioCarNumberadd() {
				carlistadddata(this.form, vm.radioCarNumber);
				this.carlistaddstate = [];
			},
			// 附近重点监控
			neighborhoodMonitor(data) {
				$.ajax({
					type: 'POST',
					url: httpurl + 'basicInfo/manager/emphasisCamera/getEmphasisCamera',
					data: JSON.stringify({
						lon: data.longitude,
						lat: data.latitude,
						sign: 'road_camera'
					}),
					dataType: 'json',
					contentType: "application/json",
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						// 成功的回调
						// console.log(data)
						vm.FocusMonitoringList = data.data
					},
					error: function (err) {
						// 失败的回调
					}
				})
			},
			checkVideoSurveilLance(data) {
				$.ajax({
					type: 'POST',
					url: httpurl + 'basicInfo/manager/emphasisCamera/getEmphasisCamera',
					data: JSON.stringify({
						lon: data.longitude,
						lat: data.latitude,
						sign: 'road_camera'
					}),
					dataType: 'json',
					contentType: "application/json",
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (list) {
						if (list.code == 200 && list.data.length != 0) {
							let listadd = {
								index: 0,
								list: list.data
							}
							window.localStorage.setItem(data.eId, JSON.stringify(listadd));
							window.open('/ndzd/src/web3.0/cn/demo1.html?id=' + data.eId, '_blank', 'height=520, width=880, top=300, left=500, toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no, depended=yes');
						}
					},
					error: function (err) {
						// 失败的回调
					}
				})
			},
			// 图片上传限制
			beforeAvatarUpload(file) {
				const isJPG = /image|jpeg|png/i.test(file.type);
				const isLt2M = file.size / 1024 / 1024 < 2;

				if (!isJPG) {
					this.$message.error('上传头像图片只能是 JPG 格式!');
				}
				if (!isLt2M) {
					this.$message.error('上传头像图片大小不能超过 2MB!');
				}
				return isJPG && isLt2M;
			},
			// 上传图片
			uploadImg(data) {
				this.imageUrl.push(data.fileName);
			},
			deleteImg(file, fileList) {
				for (let [key, val] of Object.entries(vm.imageUrl)) {
					if (val == file.response.fileName) {
						this.imageUrl.splice(key, 1);
					}
				}
			},
			//道路监控
			roadmonitoring() {
				$.ajax({
					type: 'GET',
					url: httpurl + 'basicInfo/manager/category/getCountNum/road_camera',
					dataType: 'json',
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						console.log(data, '道路监控')
						if (data.code == 200) {
							vm.roadmonitoringnum = data.data;
						}
					},
					error: function (err) {
						// 失败的回调
					}
				})
				$.ajax({
					type: 'GET',
					url: httpurl + 'event/manager/event/eventStatistics',
					dataType: 'json',
					headers: {
						Authorization: localStorage.getItem('token')
					},
					success: function (data) {
						console.log(data, '推送警情')
						if (data.code == 200) {
							vm.pushpolice = data.data.allEvent;
						}
					},
					error: function (err) {
						// 失败的回调
					}
				})
			},
			showassignperson() {
				this.assigncar = true;
				this.Taskcontenttow = !this.Taskcontenttow;
				this.Addtask = !this.Addtask;
			},
			showassigncar() {
				this.Taskcontenttow = true;
				this.carlistaddstate = [];
				this.caralllistaddstate = [];
				this.assigncar = !this.assigncar;
				this.Addtask = !this.Addtask;
			},
			showassign() {
				this.assigncar = true;
				this.Taskcontenttow = true;
				this.Addtask = !this.Addtask;
			},
		},
		mounted() {
			// 初始化地图
			this.newmap();
			// 登陆
			this.init();



		}
	})
	function wbsInfo(id) {
		if ("WebSocket" in window) {
			// alert("您的浏览器支持 WebSocket!");

			// 打开一个 web socket
			var ws = new WebSocket(`${wssrc}eventUnReadHandlePush/${id}`);

			ws.onopen = function () {
				// Web Socket 已连接上，使用 send() 方法发送数据
				ws.send("发送数据");
				// alert("数据发送中...");
			};

			ws.onmessage = function (evt) {
				console.log(this);
				vm.evenList();
				// var received_msg = evt.data;
				var received_msg = "你有一条新消息"
				var msg = new SpeechSynthesisUtterance(received_msg)
				msg.volume = 100  // 声音的
				msg.rate = 1 // 语速，数值，默认值是1，范围是0.1到10
				msg.pitch = 1.5 // 表示说话的音高，数值，范围从0（最小）到2（最大）。默认值为1
				// for (let i = 0; i < 2; i++) {
				speechSynthesis.speak(msg);
				// }
				// alert("数据已接收...");

			};

			ws.onclose = function () {
				// 关闭 websocket
				// alert("连接已关闭...");
				setTimeout(function () {
					wbsInfo(id)
				}, 10000);
			};
		}

		else {
			// 浏览器不支持 WebSocket
			alert("您的浏览器不支持 WebSocket!");
		}
	}


	function wbs(id) {
		if ("WebSocket" in window) {
			console.log("您的浏览器支持 WebSocket!");

			// 地图推送信息到工单
			var ws = new WebSocket(`${wssrc}eventPush/${id}`);
			//使用 onmessage() 方法接收数据
			ws.addEventListener("message", function (event) {
				// console.log(event.data, JSON.parse(event.data).callNumber)
				if (JSON.parse(event.data).orderSourceType == 2) {
					var data;
					var state = true; // 判断是否弹窗
					if (/\[in20min\]/.test(event.data)) {
						data = JSON.parse(event.data.replace(/\[in20min\]/, ''));
						state = false;
						// 弹窗
						vm.$notify({
							type: 'warning',
							title: '重复事件',
							message: `在${data.address}发生同一事件,请注意查看`,
							offset: 100, // 顶部偏移量
							duration: 10000 // 10秒后关闭
						});
					} else {
						data = JSON.parse(event.data);
						vm.EmergencyList.unshift(data);
					}

					// 判断当前是否在内屏
					if (vm.mapstateadd && state) {
						// 判断当前是否正在处置事件
						// 打开弹出框
						vm.EmergencyState = true;
						// 弹出消息框信息
						vm.Emergency = data;
					}

					// 判断是否是内屏弹窗提示发生事件
					if (!vm.mapstateadd && state) {
						// 弹窗
						vm.$notify({
							type: 'warning',
							title: '发生事件',
							message: `在${data.address}发生事件,请注意查看`,
							offset: 100, // 顶部偏移量
							duration: 10000 // 10秒后关闭
						});
					}

					// 语音播放二遍
					let tyype = vm.userputaddtow(data.eType);
					if (data.address.indexOf("+0") != -1) {
						var mess = `在${data.address} 发现事件类型为${tyype} 的事件,事件详情为 ${data.details}`
					} else {
						var addressdata = data.address.replace('+0', '加0');
						var mess = `在${addressdata} 发现事件类型为${tyype} 的事件,事件详情为 ${data.details}`
					}

					var msg = new SpeechSynthesisUtterance(mess)
					msg.volume = 100  // 声音的
					msg.rate = 1 // 语速，数值，默认值是1，范围是0.1到10
					msg.pitch = 1.5 // 表示说话的音高，数值，范围从0（最小）到2（最大）。默认值为1
					for (let i = 0; i < 2; i++) {
						speechSynthesis.speak(msg);
					}
				} else {
					layerwork(JSON.parse(event.data))
				}
			});
			ws.onclose = function () {
				console.log("WebSocket连接失败!");
				setTimeout(function () {
					wbs(id)
				}, 10000);
			}
			// 结束任务
			var wsEnd = new WebSocket(`${wssrc}endTaskWebSocketServer/${id}`);
			wsEnd.addEventListener('message', function (event) {
				// console.log(event);

				vm.eventEndList = JSON.parse(event.data)

				// 事件结束弹出层
				vm.isDisabled = true;
				vm.intervaleventEnd = setInterval(() => {
					--vm.second;
					if (vm.second < 0) {
						vm.addagree(1);
						vm.second = 20;
						vm.isDisabled = false;
						window.clearInterval(vm.intervaleventEnd);
					}
				}, 1000)
			})
		} else {
			// 浏览器不支持 WebSocket
			console.log("您的浏览器不支持 WebSocket!");
		}
	}

	// 倒计时
	function Timeconversion(s) {
		var jin = s;
		var dateBegin = new Date(jin); //入场时间
		var dateEnd = new Date(); //现在的时间
		var dateDiff = dateEnd.getTime() - dateBegin.getTime(); //时间差的毫秒数
		var dayDiff = Math.floor(dateDiff / (24 * 3600 * 1000)); //计算出相差天数
		var leave1 = dateDiff % (24 * 3600 * 1000) //计算天数后剩余的毫秒数
		var hours = Math.floor(leave1 / (3600 * 1000)) //计算出小时数

		//计算相差分钟数
		var leave2 = leave1 % (3600 * 1000) //计算小时数后剩余的毫秒数
		var minutes = Math.floor(leave2 / (60 * 1000)) //计算相差分钟数

		//计算相差秒数
		var leave3 = leave2 % (60 * 1000) //计算分钟数后剩余的毫秒数
		var seconds = Math.round(leave3 / 1000)
		return dayDiff + "天" + hours + "小时" + minutes + "分钟";
	}

	// 样式持久化获取
	function Persistence_getItem() {
		let maptype = JSON.parse(window.localStorage.getItem('maptype'));
		if (maptype) {
			vm.maptype = maptype

			// 卫星图 
			if (vm.maptype.bg) {
				vm.map.setMapType(BMAP_NORMAL_MAP);
			} else {
				vm.map.setMapType(BMAP_SATELLITE_MAP);
			}

			// 普通瓦片
			if (vm.maptype.checked) {
				vm.map.setMapType(BMAP_HYBRID_MAP);
			}
		}
	}

	function layerwork(data) {
		if (data.orderSourceType == 1) {
			layer.open({
				title: data.callNumber,
				type: 2,
				area: ['700px', '600px'],
				fixed: false, //不固定
				maxmin: true,
				resize: false,
				content: '/ndzd/work.html?phone=' + data.callNumber + '&id=' + data.id + '&lon=' + data.lon + '&lat=' + data.lat + '&sectionName=' + Base64.encode(data.sectionName) + '&kil=' + data.kil
			});
		} else if (data.orderSourceType == 0) {
			layer.open({
				title: data.callNumber,
				type: 2,
				area: ['700px', '600px'],
				fixed: false, //不固定
				maxmin: true,
				resize: false,
				content: '/ndzd/work.html?phone=' + data.callNumber + '&id=' + data.id
			});
		}

	}
	function workover() {

		vm.evenList();
	}
	//	layerwork({"callNumber":"15738779653","id":9,"orderName":"1623055718498","orderSourceType":0})
	// 样式持久化调用
	Persistence_getItem();
</script>